Add jQuery colorbox plugin to a dynamically created element

Asked 2010-03-14T19:43:58.383

The usual way to assign color box functionality on a link is like this:

$("a.colorbox").colorbox({ transition: "elastic" });

Newly added items are not bound in this way though.

How can I add colorbox to dynamically created

<a class="colorbox"></a>

elements too?

jquery anchor colorbox

Edit Report

2 Answers

You could also try this:

$('.colorbox').live('click',function(e){
    e.preventDefault();
    $(this).colorbox({open:true});
});

I think it's a little cleaner then using the fn command.

answered 2011-04-08T09:54:15.323

I was having the same problem as @sunburst with having to click the trigger link twice. Used the same code, but .delegate() instead of .live(). Solved everything and cleaned up my jQuery nicely!

Nice explanation here: http://www.alfajango.com/blog/the-difference-between-jquerys-bind-live-and-delegate/

answered 2012-03-07T21:30:31.667

Add jQuery colorbox plugin to a dynamically created element

2 Answers

Your Answer