Using jQuery live() to initialize plugins?

Question

Using jQuery, what's the best way to automatically initialize a plugin on all current and future elements of a specific class?

For example, say I want all <input type="text" class="datepicker" /> elements to have the jQuery UI Datepicker plugin, including any I might create at runtime.

Essentially, I want to do something like this:

$('.datepicker').live('create', function() {
    $(this).datepicker();
});

But, of course, there isn't a create event I can use.

Answer 1

If you don't want to create some funky special event, you could just add the datepicker wherever you create the new input elements.

Kind Regards

--Andy

Answer 2

From what I understand you are after creating a custom even. which is like this:

$('.datepicker').bind('foo', { 'bar'  : 'bam'  }, function(e) 

  { 

    $(this).datepicker(); 

  });   

$('.datepicker').trigger('foo');

hope this helps

Answer 3

You can use the .livequery() plugin for this, reports of it's death due to .live() have been greatly exaggerated :)

.live() listens for event to bubble so it serves a slightly different purpose. With .livequery() you'd achieve what you want like this:

$('.datepicker').livequery(function() {
    $(this).datepicker();
});

This will run on current and future .datepicker elements.