Insert Elements After Each Matching Element .after()

.after(content)

content: {One or more DOM elements, arrays of elements, HTML strings, or jQuery objects | Function( Integer index, String html )}
e.g. $("div").after("<b>text</b>")

.after(content) will insert content after each element in the matched set.

Example 1: $("div").after("<span>inserted</span>") will insert <span>inserted</span> after each <div>.
Before
<div>A</div>
<div>B</div>
After
<div>A</div>
<span>inserted</span>

<div>B</div>
<span>inserted</span>
Example 2: $("div").after("<span>insert1</span>", "<span>insert2</span>") will insert <span>insert1</span><span>insert2</span> after each <div>.
Before
<div>A</div>
<div>B</div>
After
<div>A</div>
<span>insert1</span>
<span>insert2</span>
<div>B</div>
<span>insert1</span>
<span>insert2</span>
Example 3: $("div").after($("b")) will move all <b> after <div>.
Before
<b>A</b>
<b>B</b>
<div>C</div>
After
<div>C</div>
<b>A</b>
<b>B</b>
Example 4: $("div").after( function(index) { return "<span>"+index+"</span>" ;}) insert <span>index</span> returned by function after each <div>, where index is <div> index in the matched set.
Before
<div>A</div>
<div>B</div>
After
<div>A</div>
<span>0</span>
<div>B</div>
<span>1</span>
jQuery manipulation insertion .after()