<pclass="arguement"><strong>function(index)</strong>A function that returns an HTML string to insert after each element in the set of matched elements.</p>
</li>
</ul>
<divclass="longdesc">
<p>The <code>.after()</code> and <code><ahref="/insertAfter">.insertAfter()</a></code> methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With<code> .after()</code>, the selector expression preceding the method is the container after which the content is inserted. With <code>.insertAfter()</code>, on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted after the target container.</p>
<p>Consider the following HTML:</p>
<pre><div class="container">
<h2>Greetings</h2>
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div></pre>
<p>We can create content and insert it after several elements at once:</p>
<p>Each inner <code><div></code> element gets this new content:</p>
<pre><div class="container">
<h2>Greetings</h2>
<div class="inner">Hello</div>
<p>Test</p>
<div class="inner">Goodbye</div>
<p>Test</p>
</div></pre>
<p>We can also select an element on the page and insert it after another:</p>
<pre>$('.container').after($('h2'));</pre>
<p>If an element selected this way is inserted elsewhere, it will be moved after the target (not cloned):</p>
<pre><div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
<h2>Greetings</h2></pre>
<p>If there is more than one target element, however, cloned copies of the inserted element will be created for each target after the first.</p>
<p>As of jQuery 1.4, <code>.before()</code> and <code>.after()</code> will also work on disconnected DOM nodes. For example, given the following code:</p>
<p>The result is a jQuery set containing a div and a paragraph, in that order. We can further manipulate that set, even before inserting it in the document.</p>
