How to bind events in Jquery for an element created after document load?

Question

Hi folks,

I have a set of list items in unordered lists that I bind the anchors inside them to fire when clicked. The thing is: Some ul's are created (via ajax) when I click on some of the li's created in the first place, binded in the jQuery's document.ready. And I want this li's that are created dinamically to fire as well. Can I do that?

Well, I hope you get what i mean...

Thks in advance.

Aldo

Answer 1

I think you are looking for live().

Answer 2

Check out live() method

Use it the same way as bind(), ie :

$('.class').live('click', function() { 
     alert('bla');
   }
);

Answer 3

The live() event will work on all ul elements even if you create them after you bind the live method to them. Like so:

$('ul').live('click', function() {
  // your code here...
}

See the info on live here.