在不丢失jQuery Mobile样式的情况下插入标记

Question

您好我正在尝试使用动态数据制作可折叠列表。当我试图在div中插入一些标记时，我遇到了问题。更具体地说，所有的html都没有被jQuery Mobile设计。

以下是我尝试执行此操作的简化版本：

HTML

<div id="testdiv">
</div>

THE JAVASCRIPT

$(document).ready(function() {
    append();
});

function append() {
    var str =   '' +
                '<div data-role="collapsible-set" data-theme="a" data-content-theme="d">' +
                    '<div data-role="collapsible" id="monday">' +
                        '<h2>Måndag</h2>' +
                        '<form>' +
                            '<fieldset data-role="controlgroup">' +
                                '<input type="checkbox" name="checkbox-monday-Coachtid" id="checkbox-monday-Coachtid">' +
                                '<label for="checkbox-monday-Coachtid">Coachtid</label>' +
                                '<button data-theme="b">Spara</button>' +
                            '</fieldset>' +
                        '</form>' +
                    '</div>' +
                '</div>' +
                '';
    $("#testdiv").html(str).testdiv;
}

当我尝试使用Javascript将 str 添加到这样的内容时，我最终得到如下内容：

但是，只需粘贴 str ，就好像它是在html文件中编写的那样，它看起来像这样：

我的问题，有没有办法在div中插入html并让它由jQuery Mobile渲染并获得样式？

由于

Answer 1

$('#testdiv').trigger('create')