title: how to drag and drop a copy of another drag-n-dropped image using html5?
body: <p>I have an implementation of using drag and drop for upload purposes using examples from <a href="http://robertnyman.com/html5/fileapi-upload/fileapi-upload.html" rel="nofollow">http://robertnyman.com/html5/fileapi-upload/fileapi-upload.html</a></p>
  
  <p>This is what it looks like when it works.</p>
  
  <ul>
  <li>Before drag and drop: <a href="http://cl.ly/image/0c3f1m0M2K2D" rel="nofollow">http://cl.ly/image/0c3f1m0M2K2D</a> </li>
  <li>After drag and drop: <a href="http://cl.ly/image/0Z131N333n0L" rel="nofollow">http://cl.ly/image/0Z131N333n0L</a></li>
  </ul>
  
  <p>The droparea is a div that I call dropArea.</p>
  
  <p>Now the problem is out of the supposed 4 images I have drag-n-dropped, I then wished to select two of them to be of a special status. For eg, I want to inform the server that image 1 and 3 are to be sneaks.</p>
  
  <p>I want to be able to drag and drop image 1 and 3 already in the div element into 2 drawn divs</p>
  
  <p><a href="http://cl.ly/image/3T3O410X2E40" rel="nofollow">http://cl.ly/image/3T3O410X2E40</a></p>
  
  <p>I realize I am not able to do this so far.</p>
  
  <p>Main reason being that I am unable to add in the ondragstart attribute to the images created in the dropArea div.</p>
  
  <p>I am able to add in the draggable attribute.</p>
  
  <p>So I get html code that reads like this after I drag and drop into dropArea div.</p>
  
  <p></p>
  
  <p>Can I get the effect the way I want it as described?</p>
  
  <p>if not, are there alternative ways to achieve the same outcome without using drag and drop? Perhaps right click on the drag-n-dropped image and select them as sneaks?</p>
  
  <p>UPDATE:
  I realize I needed to add an id attribute, so now the drag and drop effect of another drag-n-dropped image inside dropArea works.</p>
  
  <p>But I want to drag and drop a <strong><em>copy</em></strong> and not the original image. Hence I still need help with this.</p>