如何使用jQuery(mobile)动态添加>元素作为listview

我正试图让jQuery(移动)添加新的< li>元素到< ul>将数据角色设置为“listview”

这是html：

<div data-role="page">

   <header data-role="header">  
    <h1>Header</h1>
   </header>  

   <div data-role="content">  
    <ul data-role="listview" data-theme="a" id="sitelist">
        <li><a href="page1.html" data-transition="pop">Page1</a></li>
    </ul>
   </div>  

   <footer data-role="footer">  
    <h4>Footer text</h4>
   </footer>  

</div>

这是使用的JavaScript：

$('ul').append('<li><a href="#">sada</a></li> ');

$('ul').listview('refresh');

但问题是输出呈现为：
http://www.dumblegroup.com/Capture.png

我希望“sada”项只能呈现一次,它应该与“Page1”具有相同的格式.

我究竟做错了什么？感谢任何帮助！

/马格努斯