title: jQuery clone not working with draggable
body: <p>I am using jQuery's <code>draggable</code> and <code>droppable</code> in order to drop content elements onto a page element:</p>
  
  <pre><code>&lt;h2&gt;Page&lt;/h2&gt;
  
  &lt;div id='page-content'&gt;
  
  &lt;/div&gt;
  
  &lt;div id='content-elements'&gt;
    &lt;div id='text-element' class='content-element'&gt;Text&lt;/div&gt;
    &lt;div id='date-element' class='content-element'&gt;Date&lt;/div&gt;
  &lt;/div&gt;​
  </code></pre>
  
  <p>My JS for the draggable looks like this:</p>
  
  <pre><code>$elements.draggable({
    revert: true
  });
  </code></pre>
  
  <p>The reason I have that <code>revert</code> in there is that I want the content element to return to the list of elements and a 'duplicate' to be added to the page.</p>
  
  <p>I tried doing this using this js for the droppable (created using coffeescript):</p>
  
  <pre><code>$('#page-content').droppable({
    drop: function(event, ui) {
      var $element, $me;
      $me = $(this);
      $element = $(ui.draggable);
      console.log($element.clone(false));
      return $element.clone().appendTo($me);
    }
  });
  </code></pre>
  
  <p>What this does is get the ui element that was dragged, attempt to clone it and then append it to the page.</p>
  
  <p>This however does not work! Even though I CAN get the div, etc from the ui.draggable.</p>
  
  <p>I created a jsfiddle to illustrate the problem:
  <a href="http://jsfiddle.net/sw4Gc/2/" rel="nofollow">http://jsfiddle.net/sw4Gc/2/</a></p>
  
  <p>Why oh why?</p>