在ul插入列表項目由jquery

Question

我想插入一些列表項目從JSON內容填充ul項目，但我不明白它是什麼，我不明白我是什麼做錯了。

這是我使用的代碼：

var over_slide = $('<div id="slider" class="slider"></div>'); 

over_slide.append('<ul class="orslider">'); 

$.each(jsonobject, function (index, d) { 
    if (d.category_id == 5) { 
     over_slide.append("<li><h1 class='cufon'>" + d.naam + "</h1><h2 class='cufon'>" + d.subtekst + "</h2><p>" + d.tekst + "</p></li>"); 
    } 
}); 

over_slide.append('</ul>'); 

當我看着我的來源，當我訪問該頁面，它與正確的類名和所有的列表項的空白UL放在外面的UL認證。我怎樣才能解決這個問題？我嘗試了很多，但它仍然無法正常工作。

Answer 1

生成的li及其內容正被附加到div而不是li。

var over_slide = $('<div id="slider" class="slider"></div>'); 

var ul = $('<ul/>', {"class":"orslider"}; //create new ul object 

$.each(jsonobject, function(index, d){  
    if(d.category_id == 5){ 
     //append elements to the ul instead of the div 
     ul.append("<li><h1 class='cufon'>"+d.naam+"</h1><h2 class='cufon'>"+d.subtekst+"</h2><p>"+d.tekst+"</p></li>"); 
    } 
}); 
over_slide.append(ul); 
//at somepoint over_slide needs to be appended to the DOM 

爲了獲得更好的性能

var over_slide = $('<div id="slider" class="slider"></div>'); 

var ul = $('<ul/>', {"class":"orslider"}; //create new ul object 
var html = ""; 
$.each(jsonobject, function(index, d){  
    if(d.category_id == 5){ 
     //append elements to var 
     html += "<li><h1 class='cufon'>"+d.naam+"</h1><h2 class='cufon'>"+d.subtekst+"</h2><p>"+d.tekst+"</p></li>"; 
    } 
}); 

//only perform append once 
ul.append(html); 

over_slide.append(ul); 
//at somepoint over_slide needs to be appended to the DOM