Create a DIV within a parent DIV before another child DIV
<p>Is there a way to make to make this simpler?</p>

<pre><code>$('#content').append('&lt;div id="bar"&gt;&lt;/div&gt;');
$('#bar').insertBefore('#footer');
$('#foo').appendTo('#bar');
</code></pre>

<p>This is what the final product looks like, but I am assuming there is cleaner way to do so.</p>

<pre><code>&lt;div id="content"&gt;
   &lt;div id="bar"&gt;
     &lt;div id="foo"&gt;&lt;/div&gt;
   &lt;/div&gt;
   &lt;div id="footer"&gt;&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>...well, I got it down to two lines.</p>

<pre><code>$('&lt;div id="bar"&gt;&lt;/div&gt;').insertBefore('#footer');
$('#foo').appendTo('#bar');
</code></pre>

<p>There really wasn't a reason to append to the #content since the #footer will always be there.</p>
