title: Drag and Drop in HTML5 with CSS and JS
body: <p>I was trying to drag and drop image into its blank mold on a webpage. Therefore, I am trying with a box first. However, as I drag the image into the box the image doesn't result in the box but outside it.Any ideas what's going wrong?</p>
  
  <pre><code>function drop(ev) {
      ev.preventDefault();
      var data = ev.dataTransfer.getData("image");
      var new_img = $('#'+data).clone();
      $('#'+ev.target.id).html(new_img);
      ev.target.appendChild(document.getElementById(data));
  }
  </code></pre>