how to stop a toggle script from ending when a link is clicked?
<p>I'm using the below code to show/hide a nav and its children. It is working as intended. When the nav shows, and I click on one of the child links, it closes, and then takes me to a new page.</p>

<pre><code> // swap classes for lower level nav
  jQuery('.toggle').click(function() {
  $(this).toggleClass('toggle');
  $(this).toggleClass('toggle_open');
 });

 jQuery('a.portfolio').click(function(e) {
  e.preventDefault();
 });
</code></pre>

<p>It doesn't do this with Safari, but Chrome &amp; Firefox display the behaviour above. When I watch what is happening when the inspector is open; I click on the parent link, the toggle class is applied, I click on a child link, and the toggle class gets swapped back.</p>

<p><strong>How do I stop the nav from closing before it takes me to the requested page?</strong></p>

<p>My markup (unconventional for a nav - i know):</p>

<pre><code>&lt;span class="toggle"&gt;
 &lt;a href="portfolio/" class="level1 portfolio"&gt;Portfolio&lt;/a&gt;
   &lt;span&gt;
     &lt;a href="portfolio/item1/" class="first level2"&gt;item 1&lt;/a&gt;
     &lt;a href="portfolio/item2/" class="level2"&gt;item 2&lt;/a&gt;
     &lt;a href="portfolio/item3/" class="last level2"&gt;item 3&lt;/a&gt;
   &lt;/span&gt;   
&lt;/span&gt;
</code></pre>
