Add something after the "n" element using jQuery

Question

For a markup like

<div id="holder">     <div>div 1</div>     <div>div 2</div>     <div>div 3</div>     <div>div 4</div> </div>  

how do add some markup after the second DIV for instance?

Answer 1

Try the CSS selector :nth-child():

$("#holder > div:nth-child(2)").after("<div>foobar</div>"); 

See also the example on the jQuery page of the :nth-child() selector.