title: raphael drag and drop object from one container to another container
body: <p>I have been able to drag and drop element within same paper. Now I need to be able to drag and drop raphael element from one paper container to another.
  Here is the example:</p>
  
  <p>drag  from first svg to second svg</p>
  
  <p>first svg element in html</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;svg style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" xmlns="http://www.w3.org/2000/svg" version="1.1" width="500" height="260"&gt;
    &lt;rect style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" x="10" y="15" width="64" height="64" r="5" rx="5" ry="5" fill="#ffc0cb" stroke="#000"&gt;
    &lt;/rect&gt;
  &lt;/svg&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>second svg element in html</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;svg style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0);" &lt;/svg&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>First of all, is it possible to do? If possible, please give me some clue how to do it. thanks!</p>