title: "Active" class only sets when using extension for page
body: <p>I am attempting to make my nav bar automatically have the active class if it's on the page matching the nav bar... the other issue although is that I have URL rewriting on with htacess, nothing big, just removing the file extension for neatness.</p>
  
  <p>The only way the following code works is when I use the url with the extension.</p>
  
  <pre><code>var url = window.location.href;
  $('ul.tdsnav a[href="' + url + '"]').parent().addClass('active');
  $('ul.tdsnav a').filter(function() {
      return this.href == url;
  }).parent().addClass('active');
  </code></pre>
  
  <p>What I mean by that is... 
  MySite.com/index.php - The nav item for home turns active
  MySite.com/index - The nav item stays in active</p>
  
  <p>I have also tried the following, but it didn't seem to work...</p>
  
  <pre><code>function getBaseName(url) {
          if (!url || (url &amp;&amp; url.length === 0)) {
              return "";
          }
          var index = url.lastIndexOf("/") + 1;
          var filenameWithExtension = url.substr(index);
          var basename = filenameWithExtension.split(/[.?&amp;#]+/)[0];
  
          // Handle '/mypage/' type paths
          if (basename.length === 0) {
              url = url.substr(0, index - 1);
              basename = getBaseName(url);
          }
          return basename ? basename : "";
      }
  
      var url = window.location.href;
      var url2 = getBaseName(url);
      $('ul.tdsnav a[href="' + url2 + '"]').parent().addClass('active');
      $('ul.tdsnav a').filter(function() {
          return this.href == url2;
      }).parent().addClass('active');
  </code></pre>
  
  <p>Any help would be appreciated.</p>
  
  <p>Edit:</p>
  
  <p>The Html:</p>
  
  <pre><code>&lt;div class="sidebar" id="sidebar"&gt;
  &lt;div class="sidebar-inner slimscroll"&gt;
      &lt;div id="sidebar-menu" class="sidebar-menu"&gt;
          &lt;ul class="tdsnav"&gt;
              &lt;li class="menu-title"&gt;
                  &lt;span&gt;Main&lt;/span&gt;
              &lt;/li&gt;
              &lt;li&gt;
                  &lt;a href="index.php"&gt;&lt;i class="fe fe-home"&gt;&lt;/i&gt; &lt;span&gt;Dashboard&lt;/span&gt;&lt;/a&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>