Question

I have the following simple code, where I double click a div (with class container) and it’s simply clones itself inside another div (with id containment-wrapper):

html

<span class="container">div one</span>

<div id="containment-wrapper">
</div>

Jquery

$(".container").dblclick(function() {

        $(this).clone().appendTo('#containment-wrapper');
});

When I double click the original div, it clones itself and puts a div inside the containment-wrapper but when I double click a cloned div, it doesn’t do anything even though it has class=container, why is this happening? I tried many different ways to clone it but nothing worked.

Answer 1

It’s because the event handler isn’t cloned. Use delegate instead:

$(".container").delegate("","dblclick",function() {
  $(this).clone().appendTo('#containment-wrapper');
});