title: Javascript Drag and Drop: removing dragged element following successful drop
body: <p>I'm using the native <em>drag and drop</em> API in javascript.  How can I remove a dragged element from the DOM following a successful drop?</p>
  
  <ul>
  <li>I've tried listening to the <strong>drop</strong> event, but this only gets fired on the element which is dropped onto and has no reference to the element being dragged.</li>
  <li>I've tried listening to the <strong>dragend</strong> element, but this doesn't let me know whether a drop was successful or not.</li>
  <li>I'm trying to avoid storing the element being dragged in a global variable as this will cause problems if a drag occurs between different tabs or browsers.</li>
  </ul>
  
  <p>Here's an example: <a href="http://jsfiddle.net/KNG6n/3/" rel="noreferrer">http://jsfiddle.net/KNG6n/3/</a></p>
  
  <p>A list of letters which can be dragged into the box.  When a letter's node is dropped on the box, I'd like it to be removed from the list (without effecting any other list items containing the same letter)</p>