title: When I make a draggable clone and drop it in a droppable I cannot drag it again
body: <p>When I make a draggable clone and drop it in a droppable I cannot drag it again. How do I do that? Secondly I can only figure out how to us <code>.append</code> to add the clone to the droppable. But then it snaps to the top-left corner after any existing element and not the drop position.</p>
  
  <pre><code>$(document).ready(function() {
      $("#container").droppable({
          drop: function(event, ui) {
              $(this).append($(ui.draggable).clone());
          }
      });
      $(".product").draggable({
          helper: 'clone'
      });
  });
  &lt;/script&gt;
  
  &lt;div id="container"&gt;
  &lt;/div&gt;
  &lt;div id="products"&gt;
      &lt;img id="productid_1" src="images/pic1.jpg" class="product" alt="" title="" /&gt;
      &lt;img id="productid_2" src="images/pic2.jpg" class="product" alt="" title="" /&gt;
      &lt;img id="productid_3" src="images/pic3.jpg" class="product" alt="" title="" /&gt;
  &lt;/div&gt;
  </code></pre>