How to bind some function to non exist element?

Question

My problem: after load some element via ajax, i bind some on-click function, but when user will load few times that same element, binded action will be repeat (not replace, at least that it looks like). I tried unbind, or click(function(){return false;}); but that complete remove clic action from element...). What is standard solution of that kind of problem?

Answer 1

For most events you can use live() (jQuery 1.3+):

$("td").live("click", function() {
  // do stuff
});

This will bind a click event to <td> elements that come into existence after you run this code as well.

This is a much cleaner solution than trying to bind/unbind and ensure you don't have the same event bound twice to a particular element.

Answer 2

if you're using jQuery 1.3.2, you can use $('').live('click', function() {}); to have any elements that match that selector have the action. It keeps the event around even with new elements.