<p>I can't seem to figure out a good way to do this, but it seems like it should be simple.  I have an element that I want to <code>append a div</code> to.  Then I have another element that I want to clone and shove into that intermediate div.  Here's what I was hoping to do:</p>

<pre><code>$("#somediv &gt; ul").after("&lt;div id='xxx'&gt;&lt;/div&gt;").append($("#someotherdiv").clone());
</code></pre>

<p>This seems to be close, but not quite there.  The problem with this is that the "append" seems to be operating on the original <code>#somediv &gt; ul</code> selector.  This sort of makes sense, but it's not what I wanted.  How can I most efficiently select that intermediate div that I added with the <code>after</code> and put my <code>#someotherdiv</code> into it?</p>

[{'answer_id': 54897, 'author': 'Pat', 'author_id': 238, 'author_profile': 'https://Stackoverflow.com/users/238', 'pm_score': 0, 'selected': False, 'text': '<blockquote>\n  <p>How can I most efficiently select that intermediate div that I added with the "after" and put my "#someotherdiv" into it?</p>\n</blockquote>\n\n<p>@Vincent\'s solution is probably the fastest way to get the same result. However if for whatever reason you need add the div with <code>after()</code> then need to  select it and operate on it you can use </p>\n\n<blockquote>\n  <p><code>.nextAll( [expr] )</code></p>\n  \n  <p><code>Find all sibling elements after the current element.<br>\n  Use an optional expression to filter the matched set.</code></p>\n</blockquote>\n\n<p>So your js becomes:</p>\n\n<pre><code>$("#somediv &gt; ul")\n    .after("&lt;div id=\'xxx\'&gt;&lt;/div&gt;")\n    .nextAll(\'#xxx\')\n    .append($("#someotherdiv").clone());\n</code></pre>\n'}, {'answer_id': 54949, 'author': 'Jimmy', 'author_id': 4435, 'author_profile': 'https://Stackoverflow.com/users/4435', 'pm_score': 3, 'selected': False, 'text': '<p>use insertAfter():</p>\n\n<pre><code>$("&lt;div id=\'xxx\'&gt;&lt;/div&gt;").insertAfter("#somediv &gt; ul").append($("#someotherdiv").clone())\n</code></pre>\n'}, {'answer_id': 54970, 'author': 'Vincent Robert', 'author_id': 268, 'author_profile': 'https://Stackoverflow.com/users/268', 'pm_score': 4, 'selected': True, 'text': '<p>Go the other way around and use <code>insertAfter()</code>.</p>\n\n<pre><code>$("&lt;div id=\'xxx\'&gt;&lt;/div&gt;")\n    .append($("#someotherdiv").clone())\n    .insertAfter("#somediv &gt; ul")\n</code></pre>\n\n<p>Try to add your generated DOM nodes to the document only after finishing your work.</p>\n\n<p>Once the nodes are added to the displayed document, the browser starts listening to any change to refresh the view. Doing all the work before adding the nodes to the displayed document does improve browser performance.</p>\n'}]
['https://Stackoverflow.com/questions/54877', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/404/']