Question

I have some content from server using $.ajax() function. I try to replace some element with this data and then manipulate it. Here is code:

$.ajax({     type: 'GET',     url: 'smpl.php',     success: function(servmsg){         $('#panelInfo').replaceWith('<p>' + servmsg + '</p>');     } }); 

response from server is:

<select id='years'>     <option>2008</option>     <option>2009</option> </select> 

when I try some event on it, it’s doing nothing, for ex:

$('#years').change(function() { //or .click()     //do something }); 

Answer 1

You need to change your code to:

$.ajax({     type: 'GET',     url: 'smpl.php',     success: function(servmsg){         $('#panelInfo').replaceWith('<p>' + servmsg + '</p>');         $('#years').change(function() { //or .click()             //do something         });     } }); 

Alternately, you could keep your original ajax call code, and use livequery like so:

$('#years').livequery('change', function() { //or .click()     //do something }); 

Then when you inserted the #years block, it’d have the change event automatically registered.