Jquery mobile 如何添加元素和don'；不失风格

我是jquerymobile的新手，我正在尝试列出元素及其属性。 这是我的代码：

$(document).ready(function(){
              var text = '{"productes":[' +
              '{"Nom":"Lays","Tipus":"Patata","Categoria":"Aliments","PreuCompra":"0,35","PreuVenda":"1","Comprar":"Sí","Vendre":"Sí","UdM":"kg" },' +
              '{"Nom":"Magdalenes","Tipus":"Pasta","Categoria":"Aliment","PreuCompra":"1","PreuVenda":"1.25","Comprar":"No","Vendre":"S&iacute","UdM":"kg" },' +
              '{"Nom":"Espaguetis Gallina Blanca","Tipus":"Pasta","Categoria":"Aiment","PreuCompra":"0,40","PreuVenda":"1,30","Comprar":"Sí","Vendre":"S&iacute","UdM":"gr" },' +
              '{"Nom":"Fairy","Tipus":"Rentabaixelles","Categoria":"Neteja","PreuCompra":"0,40","PreuVenda":"1,30","Comprar":"No","Vendre":"Sí","UdM":"ml" }]}';


var obj = jQuery.parseJSON(text);
              for (var i=0; i<4; i++) {
        $("#llista").append("<div data-role='collapsible'> <h3>"+ obj.productes[i].Nom +"</h3> <p>Tipus: "+ obj.productes[i].Tipus + "<br>Categoria: " + obj.productes[i].Categoria +"<br>Preu compra: " + obj.productes[i].PreuCompra +"&euro;<br>Preu Venda: " + obj.productes[i].PreuVenda +"&euro;<br>Comprar: " + obj.productes[i].Comprar +"<br>Vendre: " + obj.productes[i].Vendre +"<br>UdM: " + obj.productes[i].UdM +"</p><button data-inline='true'>Eliminar</button><button data-inline='true'>Editar</button></div>");
    }
    $("#nou").click(function(){
         $("#llista").append("<div data-role='collapsible'> <h3>"+ obj.productes[0].Nom +"</h3> <p>Tipus: "+ obj.productes[0].Tipus + "<br>Categoria: " + obj.productes[0].Categoria +"<br>Preu compra: " + obj.productes[0].PreuCompra +"&euro;<br>Preu Venda: " + obj.productes[0].PreuVenda +"&euro;<br>Comprar: " + obj.productes[0].Comprar +"<br>Vendre: " + obj.productes[0].Vendre +"<br>UdM: " + obj.productes[0].UdM +"</p><button id='elim' data-inline='true'>Eliminar</button><button id='edit' data-inline='true'>Editar</button></div>");
    });

$（文档）.ready（函数（）{
var text='{“products”：['+
“{”Nom:“Lays”，“Tipus:“Patata”，“Categoria:“Aliments”，“PreuCompra:“0,35”，“PreuVenda:“1”，“compar:“Sí；”，“Vendre:“Sí；”，“UdM:“kg”}，”+
“{”Nom:“Magdalenes”，“Tipus:“意大利面”，“Categia:“Aliment”，“PreuCompra:“1”，“PreuVenda:“1.25”，“Compar:“No”，“Vendre:“Sí”，“UdM:“kg”}，”+
“{”Nom:“Espaguetis Gallina Blanca”，“Tipus:“意大利面”，“分类”，“Aiment”，“PreuCompra:“0,40”，“PreuVenda:“1,30”，“Compar:“Sí；”，“Vendre:“Sí”，“UdM:“gr”}，”+
“{”Nom:“Fairy”，“Tipus:“Rentabaixelles”，“categia:“Neteja”，“PreuCompra:“0,40”，“PreuVenda:“1,30”，“compar:“No”，“Vendre:“Sí；”，“UdM:“ml”}]”；
var obj=jQuery.parseJSON（文本）；
对于（var i=0；i假设#llista是一个可折叠集div，只需在附加可折叠文件后调用：

$("#llista").append(...).enhanceWithin();

这指示jQM增强容器div的所有内容，包括新添加的项

也代替

$(document).ready(function(){... 

使用jQM事件

$(document).on("pagecreate", "#pageid", function(){...

@Omar写了一篇关于页面事件的精彩文章，可以在这里找到：

假设#llista是一个可折叠集div，只需在附加可折叠集后调用enhanceWithin（）$（“#llista”）.append（…）.enhanceWithin（）；也可以代替$（document）。ready（function（）{…使用jQM$（document）。on（“pagecreate”，“#pageid”，function（）{…发布一个答案@ezanker；）@Omar，OK，找到下面的答案；）