Comment ajouter un élément de liste à une position spécifique
Je voudrais ajouter un <li> à une position spécifique, par exemple:
<ul id="list">
<li>Position 1</li>
<li>Position 2</li>
<li>Position 4</li>
<ul>
Disons que je veux ajouter un nouveau <li> en dessous/après <li>Position 2</li>, comment puis-je le faire en utilisant jQuery?
J'ai essayé de le faire en utilisant le code ci-dessous:
$('#list li:eq(1)').append('<li>Position 3</li>');
Mais cela n'a pas fonctionné, car il ajoute le <li> à l'intérieur de <li>Position 2</li>, ajoutez à la place le <li> en dessous/après le <li>Position 2</li>.
Quelqu'un peut-il m'aider?
Je vous remercie.
Vous devez utiliser after() au lieu de append():
Description: Insère le contenu, spécifié par le paramètre, après chaque élément de l'ensemble des éléments correspondants.
$('#list li:eq(1)').after('<li>Position 3</li>');
La documentation de append() dit clairement:
Insérez le contenu (...) à la fin de chaque élément.
Pour être complet:
Notez que :eq(n) correspond à nth élément de l'ensemble d'éléments correspondant, tandis que :nth-child(n) correspond à nth enfant du parent.
Vous devez utiliser after() ou insertAfter()
http://api.jquery.com/category/manipulation/dom-insertion-outside/
$('<option val="position3">Position3</option>').insertAfter('#list :nth-child(<give childnumber here>)')
l'index commence par 1
Vérifiez insertAfterici