title: HTML5 Drag-and-Drop: How do I target the cloned AND original elements?
body: <p>I want to apply a class name to the "ghost" element being dragged, not the original element that was cloned. Here is the function I have in place for the <code>dragstart</code> event:</p>
  
  <pre><code>function dragStart(event) {
      event.originalEvent.dataTransfer.effectAllowed = 'move';
      event.originalEvent.dataTransfer.setData("text/plain", event.target.getAttribute('id'));
      console.log(event);
      console.log('Dragging...');
      $(event.currentTarget).addClass('dragging');
      return true;
  }
  </code></pre>
  
  <p>The <code>$(event.currentTarget).addClass('dragging');</code> line adds the <code>.dragging</code> class to the original element but not the cloned, dragging element.</p>
  
  <p>How do I properly target both?</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Looking to handle this with native HTML5 as much as possible. Prefer not to use a jQuery plugin.</p>