Перетащите Div и отпустите динамически созданный div

Я хочу удалить div на динамически созданный div, который создается с использованием javascript при нажатии кнопки, вот мой код

$("#add").click(function() {

   var d = document.createElement("div");

   d.className = "machine";

   document.getElementById("cloud").appendChild(d);

});

это div, который я хочу перетащить на созданный выше div, вот мой перетаскиваемый код

$("#Softwares-List div").draggable({

   helper:"clone"

});

<div id="Softwares-List">

      <div id="java">Java</div>

      <div id="ror">Ruby on Rails</div>

      <div id="dotnet">Visual Studio 10</div>

</div>

Предположим, я хочу перетащить java и упасть на динамически созданный div, т.е. div.machine.

Я написал этот удаляемый код на динамически созданном div, вот мой код

$("div.machine").droppable({    

     accept: "#Softwares-List > div",

         activeClass: 'ui-state-hover',

         hoverClass: 'ui-state-active',

         drop: function(event, ui) {

             var dropElem = ui.draggable.html();

             clone = $('dropElem').clone(); 

         clone.id="newId";

         clone.css("position", "absolute");

         clone.css("top", ui.absolutePosition.top);

         clone.css("left", ui.absolutePosition.left);

             clone.draggable({ containment: 'parent' ,cursor: 'crosshair'});

             $(this).append(clone);

            alert("done dragging");

            },

});

Но он не работает, функция сбрасывания не получает вызова. пожалуйста, помогите мне также, если есть какие-либо изменения, внесенные в меня, то пожалуйста скажите.