Jquery click trigger doesnt work

Question

I have this function:

$(".action").click(function(){            
$.get('suppliers/template/get_options_list.php?action='+action+'&id='+id+'&optvalue='+optvalue+'&pid='+pid+'',
update_options);        
    }    
});    
function update_options(options){
$('#selectedoptions').html(options);    
}       

It works fine for the first click trigger but after ajax returns results next click doesnt fire.. No errors, console is clear but stilll

What could cause this? Thanks

Answer 1

$(document).on('click','.action',function(){
$.get('suppliers/template/get_options_list.php?action='+action+'&id='+id+'&optvalue='+optvalue+'&pid='+pid+'',
update_options);      
});    
function update_options(options){
$('#selectedoptions').html(options);
}

and if .action if a submit input use

$(document).on('submit','your_form_ID_or_Class',function()

Answer 2

Try binding the click event to the body, rather than the specific element, which won't be bound anymore once you replace the html:

    $("body").on("click", ".action", function(){            
      $.get('suppliers/template/get_options_list.php?action='+action+'&id='+id+'&optvalue='+optvalue+'&pid='+pid+'',
update_options);        
    }    
});    
function update_options(options){
$('#selectedoptions').html(options);    
}       

Answer 3

I removed the ajax returned html and instead of it on ajax response I used .remove() function to remove elements instead of generating new html.. Thank you for your help guys ! This isnt the original solution but it works fine..