How to add a div tag in $(this).children.append() without losing the existing animation effect
<p>I want a navigation bar to be present in every page. Instead of declaring it in everypage I used .append() function as below.</p>

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

<p>When I add the navigation bar directly in <strong>page-role="content"</strong> section the animation effect is working perfectly. But with .append() function, the animation effects are not working. It's showing the entire list normally. And one more problem is the navigation bar is not showing up in the first page. Just showing blank section.</p>
