jquery - recorrer - Cómo agregar un elemento de lista en una posición específica

recorrer todos los input de un formulario jquery

Question

Me gustaría agregar un <li> en una posición específica, por ejemplo:

<ul id="list">
    <li>Position 1</li>
    <li>Position 2</li>
    <li>Position 4</li>
<ul>

Digamos que quiero agregar un nuevo <li> debajo / después de <li>Position 2</li> , ¿cómo puedo hacerlo usando jQuery?

Intenté hacerlo usando el siguiente código:

$(''#list li:eq(1)'').append(''<li>Position 3</li>'');

Pero no funcionó, ya que agrega el <li> dentro de la <li>Position 2</li> , en su lugar, agregue el <li> siguiente / después de la <li>Position 2</li> .

¿Puede alguien ayudarme?

Gracias.

Answer 1

Debe usar after() o insertAfter()
http://api.jquery.com/category/manipulation/dom-insertion-outside/

Answer 2

Tienes que usar after() lugar de append() :

Descripción: inserte el contenido, especificado por el parámetro, después de cada elemento en el conjunto de elementos coincidentes.

$(''#list li:eq(1)'').after(''<li>Position 3</li>'');

La documentación de append() dice claramente:

Insertar contenido (...) al final de cada elemento.

Por completitud:

Tenga en cuenta que :eq(n) coincide con el n ésimo elemento del conjunto de elementos coincidentes, mientras que :nth-child(n) coincide con el n ésimo hijo del elemento principal.

Answer 3

Verifique la insertAfter here

Answer 4

$(''<option val="position3">Position3</option>'').insertAfter(''#list :nth-child(<give childnumber here>)'')

índice comienza con 1