jQuery Mobile输出问题

我正在使用jQuery mobile，我需要创建一个可折叠（手风琴）项目的列表。我的问题是，主要的可折叠项目被嵌套在彼此之间。我需要分组分开，像这样：

[坍塌的一个]
 nbsp （图片）
 nbsp 名称A
 nbsp 链接A1
 nbsp linkA2

[坍塌的两个]
 nbsp （图片）
 nbsp 名称B
 nbsp 链接B1
 nbsp 链接B2


 nbsp （图片）
 nbsp 名称C
 nbsp 链接C1
 nbsp 链路C2

可折叠列表看起来应该是堆叠的，如API页面所示

以下是我得到的：http://jsfiddle.net/pggJm/1/


output.json

{
    "actions" : [
        {
            "venue": "COLLAPSIBLE ONE",
            "event": [
                {
                    "img": "imgA.jpg",
                    "name": "Name A",
                    "location": "loc A",
                    "desc": "desc A",
                    "link1": "linkA1.html",
                    "link2": "linkA2.html"
                }
            ]
        },
        {
            "venue": "COLLAPSIBLE TWO",
            "event": [
                {
                    "img": "imgB.jpg",
                    "name": "Name B",
                    "location": "loc B",
                    "desc": "desc B",
                    "link1": "linkB1.html",
                    "link2": "linkB2.html"
                },
                {
                    "img": "imgC.jpg",
                    "name": "Name C",
                    "location": "loc C",
                    "desc": "desc C",
                    "link1": "linkC1.html",
                    "link2": "linkC2.html"
                }
            ]
        }
    ]
}

main.js

$.ajax({
    url: "output.json",
    dataType: 'json',
    success: function (data) {
        var html2 = [];
        $.each(data.actions, function(i, entry) {
                html2.push('<div data-role="collapsible" data-theme="a" data-content-theme="d" data-inset="false">')
                html2.push('<h4>'+this.venue+'</h4>');      
           $.each(this.event, function() {
                html2.push('<img src="'+this.img+'" class="img_border" alt="'+this.img+'"/>');
                html2.push('<p>'+this.name+'</p>');
                html2.push('<p>'+this.location+'</p>');
                html2.push('<a href="'+this.link1+'" target="_blank" data-role="button">Lorem</a>');
                html2.push('<a class="external" href="'+this.link2+'" target="_blank" data-role="button">Ipsum</a>');
            });
        });
        $('#cat2').append( html2.join('') ).trigger( "create" );
    } // end success
});