jQuery Mobile: Navigation does not open after page change
<p>In my jQuery Mobile project I have an element <code>#sidebar</code> with a toggle icon. </p>

<p>In my base file, just under the #sidebar div I use the following code:</p>

<pre><code>&lt;a href="javascript:void(0)" id="toggle-sidebar"&gt;Toggle sidebar&lt;/a&gt;
&lt;div id="sidebar"&gt; ... &lt;/div&gt;

$('#toggle-sidebar').on('click', function() {
   $('#sidebar').toggleClass('visible');
});
</code></pre>

<p>When my page loads for the first time, toggling works perfectly fine. However, when I change pages via my main navigation the toggling does not work anymore. I put an alert inside the click function and realized that AFTER page change the alert gets executed multiple times, namely as many times as I changed the page before. </p>

<p>The toggling works again when I move to the other page by entering the URL in my browser and loading the page.</p>

<p>How can I solve this problem?</p>