Jquery 如何在$（this.children.append（）中添加div标记而不丢失现有动画效果

我希望每个页面都有一个导航栏。我没有在每个页面中声明它，而是使用了.append（）函数，如下所示

$(document).on('pageinit', '[data-role="page"]', function () {
$(this).children('[data-role="content"]').append('<div class="mainleft" datarole="collapsible-set"> <div data-role="collapsible" data-collapsed="true"><ul><li><a href="#">Hi</a></li><li><a href="#">Hello</a></li></ul></div></div>');
}); 

$（document）.on（'pageinit'，'data role=“page”]'，function（）{
$（this）.children（'[data role=“content”]'）。append（'
'）；
}); 

当我直接在页面role=“content”部分添加导航栏时，动画效果非常好。但是使用.append（）函数时，动画效果不起作用。它正常显示整个列表。还有一个问题是导航栏没有显示在第一页中。只是显示空白部分