Question

html:

<div id="divDroppable">
    <div id="element1"></div>
    <div id="element2"></div>
    <div id="element3"></div>
</div>

jquery:

  $("#element1").draggable();
  $("#element1").droppable({
  drop: function() { alert('dropped'); }

drop function alert is not fire where is my mistake? i want a loop which perform each elemt of div must be dragged but unable to loop between them bcz each id is different.

Answer 1

The first thing I notice is you have a syntax error. The line isn’t complete.

$("#element1").draggable();
$("#element1").droppable({
    drop: function() { alert('dropped'); }
});

If you want to do the same to each element you could do something like this:

$("#divDroppable div").each(function() {
    var id = this.id
    $(this).draggable().droppable({
        drop: function() { alert('dropped ' + id); }
    });
});