使用append时，样式丢失 - jquery mobile

Question

使用jquery mobile可以使用以下代码（如下所示），但是当它呈现给页面时，缺少样式。它们只是计划链接，不应该采用data-role =“button”样式。我已经对代码生成的相同链接进行了硬编码，这样做很好。

如何解决此问题？

由于

   $(document).on('pagebeforeshow', '#index', function(){

    $.each(siteData["pages"], function(i,v) {    
         $.mobile.activePage.find('[data-role=content]').append('' +
                 '<a href='+ v["id"] + ' data-role="button">' + v["name"] + '</a>');
    });

   });

标记

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
    </div>

    <div data-role="content" class="navlist">
    </div>

    <div data-role="footer">
</div>

我得到了什么......

应该是什么样的......

代码在第二张图片上呈现的内容相同，但动态内容却缺少样式。

Answer 1

在.trigger('create')

之后添加.append()

Working example

$.each(siteData["pages"], function(i,v) {    
 $.mobile.activePage.find('[data-role=content]').append('' + '<a href='+ v["id"] + ' data-role="button">' + v["name"] + '</a>').trigger('create');
});