How do I attach jQuery .live() to this snippet of code?

I'm using a plugin called cloud zoom. the problem is, it attaches itself to anything with class="cloud-zoom" when the DOM is ready. My problem is I don't attach that class to DOM elements at render time. It is appended dynamically. So I need somehow to mix .live() with it to make it work:

$(document).ready(function () {
    $('.cloud-zoom, .cloud-zoom-gallery').CloudZoom();
});

.live() expects an event. I'm not sure how to specify an event called invoke CloudZoom() on any element that gets injected into the DOM with the class clo开发者_如何学Goud-zoom.

You can't use .live() here, it works in a very different event-driven specific way. For plugins on dynamic elements there are 2 options, either re-run this code when new elements come in, for example in your ajax success handler, or using the .livequery() plugin, like this:

$(document).ready(function () {
    $('.cloud-zoom, .cloud-zoom-gallery').livequery(function() {
      $(this).CloudZoom();
    });
});

I think it might be something like :

$(document).ready(function () {
    $('.cloud-zoom, .cloud-zoom-gallery').live(function(){
        $(this).CloudZoom();
    });    
});

Ok, nevermind, it expects an event. I was thinking about jQuery Livequery plugin, which accepts anonymous function without event

You can try this if the above doesn't work:

$(document).ready(function () {
$('.cloud-zoom, .cloud-zoom-gallery').live(function(){
    $(this).CloudZoom();
}).trigger('click');    

});

Just add the trigger click at the end, works for me.