title: Set link of my navbar active with bootstrap
body: <p>I try to set active the element of my navbar when I click on the button.</p>
  
  <p>My navbar is like that: </p>
  
  <p><img src="https://i.stack.imgur.com/tSwo9.png" alt="navbar"></p>
  
  <p>But when I click on the "a" for exemple, the "G" remains active.</p>
  
  <p>My code is like that: </p>
  
  <pre><code>&lt;div class="navbar span8" id="navbar"&gt;
      &lt;div class="navbar-inner"&gt;
          &lt;ul class="nav"&gt;
               &lt;li&gt;&lt;a href="#a"&gt;A&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#b"&gt;B&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#c"&gt;C&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#d"&gt;D&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#e"&gt;E&lt;/a&gt;&lt;/li&gt;
               &lt;li&gt;&lt;a href="#f"&gt;F&lt;/a&gt;&lt;/li&gt;    
                .....         
         &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>To set a class active the code is: </p>
  
  <pre><code> &lt;li class="active"&gt;&lt;a href="#f"&gt;F&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>How can I do that with jQuery?</p>