Jquery append() n'est pas comme prévu

Question

Annexer des

J'ai donc le div suivant

<div id="object_list"> 

Je veux ajouter une liste et articles en elle. Alors, je lance le jquery suivant

 $("#object_list").empty(); 
     $("#object_list").append('<ul'); 
     $("#object_list").append(list.contents()); 
     $("#object_list").append('</ul>'); 

Après que le code fonctionne, #object_list ressemble à ce

<div id="object_list"> 
    <ul></ul> 
    ...list.contents() elements 
</div> 

Même après le débogage, si je fais une autre $("#object_list").append('<ul>'); tout ce que je reçois est ajouté <ul> après la </ul>. Pourquoi jquery ne s'ajoute pas au HTML après le list.contents(), mais va-t-il avant?

Answer 1

Append n'ajoute pas simplement les balises, il en fait des éléments ajoute. Dans votre cas, vous souhaitez ajouter des éléments de liste à une liste non ordonnée qui est ajoutée à votre div.

faire:

$('<ul>').appendTo('#object_list').append(list.contents()); 

Answer 2

Le problème est que vous continuez d'ajouter "object_list" lorsque vous souhaitez ajouter des éléments à la liste elle-même. (En aparté, vous ne fermons pas votre étiquette UL instanciation soit)

Essayez quelque chose comme ceci:

var $list = $("<ul></ul>"); 
$list.append("<li>Something 1</li>"); 
$list.append("<li>Something 2</li>"); 
$list.append("<li>Something 3</li>"); 

$("#object_list").append($list);