algo después de que el elemento de "n" usando jQuery

Question

Por un margen de beneficio como

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

¿cómo añadir un poco de margen de beneficio después de la segunda DIV por ejemplo?

Gracias,
Titel

Answer 1

Prueba la CSS selector :nth-child():

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

Véase también el ejemplo de la jQuery page of the :nth-child() selector.

Answer 2

$("#holder div:eq(1)") seleccionará el segundo div hijo del #holder div. (:eq() selector info). Luego use la función .after() para agregar contenido.

Answer 3

Uso InsertAfter (selector)

http://docs.jquery.com/Manipulation/insertAfter

Answer 4

utilizar el selector :eq(index) o :nth-child(index/even/odd/equation) en combinación con la función de append(content) o after(content).

por ejemplo, asumiendo este código:

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

usando agregar como esto

$("#holder>div:eq(1)").append("<div>inserted div</div>");

o esta

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

le dará

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

mientras se utiliza después como esto

$("#holder>div:eq(1)").after("<div>inserted div</div>");

o esta

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

le dará

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

usando: nth-child puede ser útil ya que le permite establecer contenido cada n cantidad de elementos. También, el índice de: nth-child comienza a 1, mientras que el índice de: eq comienza en 0

por ejemplo, utilizando

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

le dará

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

Answer 5

uso de este

$("ul li:nth-child(4n)").add('ul li:last').after("<div style='clear:both;'>&nbsp;</div>"); 

Answer 6

Inténtelo de esta manera:

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

Se insertará el <div>insert here</div> después de cada fila segunda:

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