title: Insert Content Before and After an Element Without Autoclosing tags
body: <p>Say I have the following:</p>
  
  <pre><code>&lt;div id="content"&gt;content&lt;/div&gt;
  </code></pre>
  
  <p>And I want to insert some stuff before it ** (notice the unclosed div)**:</p>
  
  <pre><code>$("#content").before("&lt;div&gt;pre-pre-content&lt;/div&gt;&lt;div&gt;pre-content ");
  </code></pre>
  
  <p>And some then some more after ** (notice I am now closing the div)**:</p>
  
  <pre><code>$("#content").after(" post-content&lt;/div&gt;&lt;div&gt;post-post-content&lt;/div&gt;");
  </code></pre>
  
  <p>My desired output is:</p>
  
  <pre><code>&lt;div&gt;pre-pre content&lt;/div&gt;
  &lt;div&gt;
      pre-content &lt;div id="content"&gt;content&lt;/div&gt; post-content
  &lt;/div&gt;
  &lt;div&gt;post-post content&lt;/div&gt;
  </code></pre>
  
  <p>Instead, what I get is:</p>
  
  <pre><code>&lt;div&gt;pre-pre content&lt;/div&gt;
  &lt;div&gt;pre-content&lt;/div&gt;
  &lt;div id="content"&gt;content&lt;/div&gt;
  &lt;div&gt;post-content&lt;/div&gt;
  &lt;div&gt;post-post content&lt;/div&gt;
  </code></pre>
  
  <p>Because jQuery is automatically "correcting" the unclosed tags.</p>
  
  <p><strong><a href="http://jsfiddle.net/Lz373/1/" rel="nofollow noreferrer">fiddle</a></strong></p>
  
  <p>Is there a way to use .wrap() to add different content before and after an element without automatically closing tags?</p>
  
  <p>Note, I <strong>cannot</strong> do the following because of an unrelated restriction:</p>
  
  <pre><code>$("#content").html("&lt;div&gt;Content before " + $("#content).html() + " Content after&lt;/div&gt;")
  </code></pre>