javascript - jquery - Click event not working for dynamically created button within a table -


i have looked though historic answers question nothing seems working me

when button clicked on page , div box becomes visible , table added

$('#newparentitem').click(function() {   innertable =  "<table width='90%' bgcolor='#cccccc' align='center'  >" innertable += "<tr height='12px'> " innertable += "<td width='2%'></td> "    innertable += "<td width='68%' style='text-align:center' > <input type='text' name='item' placeholder='main item name' size='12'> </td> "    innertable += "<td width='30%'> <button type='button' id='newparentsubmit' value='generate new element' >enter </button>  </td> " innertable += "</tr> </table>"  displayunidiv(160,200,50,200) // display div box $('#unidivhead').html("add new main group item (parent)")            $('#unidivbody').html( innertable )          }) ; // end of function `   

this table includes button id newparentsubmit

further within script have following

$(document).on('click', '#newparentsubmit' , function() {     alert(" submit ")       }) ;     // end of function 

i expect trigger( after button has been dynamically created ) when user clicks button , nothing happening ?

all these functions contained within

$(document).ready(function() {   }); 

can offer solution or suggestion please ?

thanks

have https://jsfiddle.net/1waumb6d/

$(document).ready(function() { $('#newparentitem').click(function() {   innertable =  "<table width='90%' bgcolor='#cccccc' align='center'  >" innertable += "<tr height='12px'> " innertable += "<td width='2%'></td> "    innertable += "<td width='68%' style='text-align:center' > <input type='text' name='item' placeholder='main item name' size='12'> </td> "    innertable += "<td width='30%'> <button type='button' id='newparentsubmit' value='generate new element' >enter </button>  </td> " innertable += "</tr> </table>"  //displayunidiv(160,200,50,200) // display div box $('#unidivhead').html("add new main group item (parent)")            $('#unidivbody').html( innertable )          }) ;  });  $(document).on('click', '#newparentsubmit' , function() {     alert(" submit ")       }) ;  

the enter button working expected.


Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -