How to bind to a function dynamically, similar to live

Question

Let's say that I am using a 3rd party utility tool and I can't change the code in that cool. The tool does nothing else but

$(this).live('click', function(){

 this.trigger('custom:callback');

});

The way I use it is

$('a').bind('custom:callback', function(){
  alert('callback is being invoked');
});

Above code works fine. However if I dynamically create an 'a' element then I HAVE to run

$('a').bind('custom:callback', function(){
  alert('callback is being invoked');
});

otherwise the callback by the third party tool does not work.

Is there a way to setup the binding dynamically so that if I dynamically create an 'a' element then I don't need to run the code.

Answer 1

You can use .live() with custom events as well, for example:

$('a').live('custom:callback', function(){
  alert('callback is being invoked');
});

This should eliminate the need to bind to each as it appears, though if you have to do that, it's what the .livequery() plugin is still good at...it would look like this:

$('a').livequery(function() {
  $(this).bind('custom:callback', function() {
    alert('callback is being invoked');
  });
});