Day 037 - After and Before

To add content after or before, you can simply use .after and .before.

In our HTML if we have:

<ul>
    <li class="one">List Item One</li>
    <li class="three">List Item Three</li>
    <li class="five">List Item Five</li>
</ul>

Then with jQuery we add:

$('ul li.one').after('<li class="two">List Item Two</li>');
$('ul li.five').before('<li class="four">List Item Four</li>');

The first line adds a list item with a class of two after the list item with a class of one.

The second line adds a list item with a class of four before the list item with a class five.

Here's the results Demo.