title: How to add .current class to parent li using jquery
body: <p>I was wondering if someone can help me. I trying to add .current class to the active parent in my navigation.</p>
  
  <p>Here is my navigation:</p>
  
  <pre><code>&lt;ul id="top-nav"&gt;
  &lt;li&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;About&lt;/a&gt;
      &lt;ul id="about-dropdown" class="dropdown"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Sub Cat&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Sub Cat 1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Sub Cat 2&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Blog&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I have managed to get the .current class to display on the current page but when the user is on a sub page, eg. "Sub Cat 1" I want the "About" a tag to add the .current page. </p>
  
  <p>Here is my Jquery:</p>
  
  <pre><code> var url = window.location.pathname, 
   urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there
      // now grab every link from the navigation
      $('#top-nav a').each(function(){
          // and test its normalized href against the url pathname regexp
          if(urlRegExp.test(this.href.replace(/\/$/,''))){
              $(this).addClass('current');
          }
  
          $(document).ready(function(){
  $("li.current").parent().addClass("current");
  });
  
                  $(document).ready(function(){
  $("ul.current").parent().addClass("current-parent");
  });
  </code></pre>
  
  <p>If anyone can help it would be appreciated :-)</p>
  
  <p>Thanks</p>