title: Drag and insert div into another div
body: <p>I am trying to design a feature that could drag and insert one div into another div.</p>
  
  <p>For example:</p>
  
  <p><code>&lt;div id="1"&gt; &lt;/div&gt;<br>
   &lt;div id="2"&gt; &lt;/div&gt;</code></p>
  
  <p>i want to make #1 draggable (I know it can be done with jQuery, so draggable is not part of my question), and drag #1 over #2, and when mouseup, #2 could be inserted into #1</p>
  
  <pre><code>&lt;div id="1"&gt; &lt;div id="2"&gt; &lt;/div&gt; &lt;/div&gt;
  </code></pre>
  
  <p>could somebody explain to me how to achieve that?</p>