title: When cloning a draggable object in jQuery UI, how can you transfer the data and events to the new element?
body: <p>I have a draggable element with the <code>helper: 'clone'</code> set, but when it clones the element, none of the <code>data()</code> or events are persistent in the new element.</p>
  
  <p>I've tried a number of ways to reattach the <code>data()</code>, but I can't seem to select the new element as well as the old element in the same statement.</p>
  
  <p>For instance, I can select the initial element in the draggable <code>stop()</code> event:</p>
  
  <pre><code>$blah.draggable({
      helper: 'clone',
      stop: function(ev, ui) {
          var oldData = $(ev.target).data('blah');
      }
  });
  </code></pre>
  
  <p>And I can also get the new element in the droppable <code>drop()</code> event:</p>
  
  <pre><code>$blah.droppable({
      drop : function(ev, ui) {
          var $newElement = ui.draggable;
      }
  });
  </code></pre>
  
  <p>But I can't figure out a way to get both in the same event.</p>
  
  <p>What I'd like to do is somehow transfer the data, e.g.:</p>
  
  <pre><code>$newElement.data('blah', $oldElement.data('blah'));
  </code></pre>
  
  <p>Or otherwise make the data persistent, like you can with <code>$blah.clone(true);</code></p>