How to grab and return a Div with its Id included
<p>Seems like a super simple question but I can't find an answer.</p>

<p>I'm grabbing a DIV "user-entry"</p>

<pre><code>var $user = $('#user-entry');
</code></pre>

<p>HTML:</p>

<pre><code>&lt;div id="user-entry"&gt;

&lt;table style="border: none; width: 100%"&gt;
            &lt;thead&gt;
                &lt;tr&gt;
                    &lt;th colspan="2" style="text-align: left"&gt;
                        @Html.Label("Hello World")
                    &lt;/th&gt;
                &lt;/tr&gt;
            &lt;/thead&gt;
    &lt;/table&gt;
&lt;/div&gt;
</code></pre>

<p>Now I want to append this to another div <code>&lt;div id="role"&gt;&lt;/div&gt;</code>.
That's what JQuery append(), appendTo(), prepend(), prependTo() functions are for. Great!</p>

<p>My problem is that when used the DIV is being added without the actuall DIV name.
If example run:</p>

<pre><code>            var $user= $('#user-entry');
            $($user.html()).appendTo('#role');
</code></pre>

<p>Then my table is being properly appended to the "role" but the user DIV itself doesn't show.</p>

<p>Instead of:</p>

<pre><code>&lt;div id="role"&gt;
   &lt;div id="user-entry"&gt;
      &lt;table style="border: none; width: 100%"&gt;
     &lt;/table&gt;
   &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I end up with:</p>

<pre><code>&lt;div id="role"&gt;
      &lt;table style="border: none; width: 100%"&gt;
     &lt;/table&gt;
&lt;/div&gt;
</code></pre>

<p>How can I capture and return a div with its name Included ?</p>
