javascript - Repeated jQuery POST ajax calls to a php file with output only works once -

this question has answer here:

• event binding on dynamically created elements? 18 answers

so have few links that's values stored in jquery , used variable php file calls. in php file, outputs same exact links process can continue without refreshing page. but, second time clicking links not produce jquery post ajax call php file.

here jquery code

jquery('.wantedstatus').on('click', function(event) {     var anime_id = <?php echo $anime_id; ?>;     var anime_list_entry_id = <?php echo $anime_list_entry_id; ?>;     var wantedstatus = jquery(this).tex        jquery.post("/path/to/php/file/updatestatus_animelist.php", {firstparam : anime_id, secondparam : anime_list_entry_id, thirdparam : wantedstatus}, function(data) {          //this response data serv          console.log(data);          jquery('#anime_list_update').html(data);     });     return false; }); 

the links activate function.

<a href="javascript:void(0);" class="wantedstatus">watching</a> <a href="javascript:void(0);" class="wantedstatus">plan watch</a> <a href="javascript:void(0);" class="wantedstatus">on hold</a> <a href="javascript:void(0);" class="wantedstatus">dropped</a> 

now these exact links outputted updatestatus_animelist.php , when clicked again, don't work.

because elements getting replaced on each call, want listen click on either parent or document.

please try:

jquery(document).on('click', '.wantedstatus', function(event) {   ... });