title: Move element after nth paragraph with jQuery
body: <p>I want to move move a div <code>#inject</code> from its original postion to right after the 7th paragraph <code>#mw-content-text</code>.</p>
  
  <p>So far I have this <code>$('#inject').insertAfter('#mw-content-text &gt; p:nth-child(7)');</code> which is moving the <code>#inject</code> div to right after the 7th elment inside <code>#mw-content-text</code> only if that 7th elment is a <code>&lt;p&gt;</code>, if its something different it wont do anything.</p>
  
  <p>For example if the article has the following structure it works (since the 7th elment is a <code>&lt;p&gt;</code>)</p>
  
  <pre><code>&lt;div id="mw-content-text"&gt;
      &lt;table&gt;&lt;/table&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      /* div #inject is injected here */
      &lt;p&gt;&lt;/p&gt;
      &lt;h2&gt;&lt;/h2&gt;
      ...
  </code></pre>
  
  <p>If the article looks like this on the other hand (were the 7th elment is an <code>&lt;h2&gt;</code>) then it does nothing</p>
  
  <pre><code>&lt;div id="mw-content-text"&gt;
      &lt;table&gt;&lt;/table&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;p&gt;&lt;/p&gt;
      &lt;h2&gt;&lt;/h2&gt;
      &lt;p&gt;&lt;/p&gt;
      ...
  </code></pre>
  
  <p>Can anybody see what I'm doing wrong? What would be the proper way to refer to the 7th <code>&lt;p&gt;</code> element inside #mv-content-text instead of the 7th element only when its a <code>&lt;p&gt;</code>?</p>