title: jQuery duplicate item inside div
body: <p>I have the following HTML structure:</p>
  <pre><code>&lt;div id=&quot;container&quot;&gt;
       &lt;div class='label-item-text drag' data-type='text'&gt;
           &lt;div&gt;Right click on me and check the HTML of the duplicated&lt;/div&gt;
       &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>And I'm trying to duplicate the items inside <code>#container</code>. Unfortunately is not working as I expect.</p>
  <blockquote>
  <p>A) My code duplicates all the items inside, when actually I have only selected one</p>
  <p>B) I can't duplicate properly</p>
  </blockquote>
  <p>The code that duplicates all items is the following.</p>
  <pre><code>$('#container').append($dragRightClick.parent().html());
  </code></pre>
  <p>Well, the <code>parent()</code> of <code>$dragRightClick</code> is the <code>#container</code>, so I understand the reason why it duplicate all the items...</p>
  <p><strong>What I want to duplicate</strong> is only the div inside the <code>#container</code>, that means:</p>
  <pre><code>&lt;div class='label-item-text drag' data-type='text'&gt;
      &lt;div&gt;Right click on me and check the HTML of the duplicated&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>But what I've got so far is only:</p>
  <pre><code>&lt;div&gt;Right click on me and check the HTML of the duplicated&lt;/div&gt;
  </code></pre>
  <p>The following code outputs the above code:</p>
  <pre><code>console.log(&quot;Clone: &quot; + $dragRightClick.clone().html());
  console.log(&quot;HTML: &quot; + $dragRightClick.html()); 
  </code></pre>
  <p>You can check the full problem <strong><a href="http://jsfiddle.net/o6s7cyzf/" rel="noreferrer">in JSFiddle</a></strong>.</p>