Insert Elements Before Each Matching Element .before()

.before(content)

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

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

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

<span>inserted</span>
<div>B</div>
Example 2: $("div").before("<span>insert1</span>", "<span>insert2</span>") will insert <span>insert1</span><span>insert2</span> before each <div>.
Before
<div>A</div>
<div>B</div>
After
<span>insert1</span>
<span>insert2</span>
<div>A</div>

<span>insert1</span>
<span>insert2</span>
<div>B</div>

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