Question

I have a div with class .myClass, I am cloning it by clicking on #cloneIT
It clone that div perfectly but when I drag it always dragged first div.
here my code:

$("document").ready(function(){
$(".myClass").draggable({ containment: 'parent' });
 var countClones = 0;
$("#cloneIt").click(function(){
$('.myClass').clone(true).attr('id',$('div.myClass')[0].id+countClones).prependTo('body');
 countClones += 1;
    var newDiv = $("<div>Cloned: " + countClones + "</div>");
  $("body").append(newDiv);
  return false;
});

});

jsFiddle:
http://jsfiddle.net/qQ6ws/3/

1)
When u click on Clone It, plz drag Test, It will have cloned version which I am not able to click or drag.

2) Fixed in update

UPDATE:
http://jsfiddle.net/qQ6ws/3/

I have fixed second issue now only problem is i can’t drag cloned version or even click them
Thanks for any help.

Answer 1

I guess this is what you want ? Cloning the draggable element doesn’t seem to clone the events as well even with clone(true) passed in as the parameter. I have noticed this with other jQuery controls also such as droppable. You have to explicitly call .draggable() on the cloned element.