title: location.hash issue in js
body: <p>I have a piece of javascript that I inherited; it's being used as a tab switcher. Unfortunately it's not working. Here's the code:</p>
  
  <pre><code>$(document).ready(function(){
  
      /* This is the back button friendly tab switcher */
      var trackContainers = $('.switcher &gt; .results');
    trackContainers.hide().filter(':first').show();
  
    $(window).bind('hashchange', function () {
      var hash = window.location.hash || '#dpp';
      console.log('hash: ' + hash);
  
      trackContainers.hide();
      trackContainers.filter(hash).show();
      $('ul.tabs li').removeClass('active');
      $('a[hash='+hash+']').parent().addClass('active');
    });
  
    $(window).trigger("hashchange").location(hash);
  
  });
  </code></pre>
  
  <p>What's supposed to happen is when a specific tab is clicked, it changes the class of the li tag surrounding the clicked tab. Here's what the tab code looks like:</p>
  
  <pre><code>&lt;div class="switcher"&gt; 
  &lt;ul class="tabs"&gt; 
  &lt;li  class="inactive"&gt;&lt;a href="#dpp"&gt;Digital Path to Purchase&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#cre"&gt;Fueling Creativity&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#bpp"&gt;Best Practices/Big Picture&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#si"&gt;Shopper Insights 101&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#dem"&gt;Who Is Your Shopper&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#gt"&gt;Google Theater&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#res"&gt;Understanding the Shopper&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="inactive"&gt;&lt;a href="#bar"&gt;Brand Activation at Retail&lt;/a&gt;&lt;/li&gt; 
  &lt;li class="active"&gt;&lt;a href="#duc"&gt;Deeper Understanding of Center Store&lt;/a&gt;&lt;/li&gt; 
  &lt;/ul&gt; 
  &lt;/div&gt; 
  &lt;/div&gt; 
  </code></pre>
  
  <p>You can see that the link called #duc has the active class on its li item. However, when I look at the script code in Firebug, it gives me an error saying hash is not defined:</p>
  
  <p><img src="https://i.stack.imgur.com/7Ybwa.png" alt="enter image description here"></p>
  
  <p>Again, looking in Firebug, but this time at the console tab, it very clearly shows that hash IS defined:</p>
  
  <p><img src="https://i.stack.imgur.com/4BUPH.png" alt="enter image description here"></p>
  
  <p>Can anyone point out how it's losing its definition between the console.log and the .trigger lines?</p>