how to add class active in bootstrap navbar
<p>hello i have a navbar from bootstap and i want to add class avtive when i switch page automativly.</p>

<p>how to do that. i have my script but it wont work.</p>

<p>how to do that with jquery?</p>

<pre><code>&lt;nav class="navbar navbar-default navbar-inverse navbar-fixed-top"&gt;
        &lt;div class="container"&gt;
          &lt;!-- Brand and toggle get grouped for better mobile display --&gt;
          &lt;div class="navbar-header"&gt;
            &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"&gt;
              &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;/button&gt;
            &lt;a class="navbar-brand" href="#"&gt;
              &lt;img src="img/logogram.png" alt=""&gt;
            &lt;/a&gt;
          &lt;/div&gt;

          &lt;!-- Collect the nav links, forms, and other content for toggling --&gt;
          &lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
            &lt;ul class="nav navbar-nav"&gt;
              &lt;li class="active"&gt;&lt;a href="people.html"&gt;people&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;gallery&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="inspiration.html"&gt;inspiration&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;

            &lt;ul class="nav navbar-nav navbar-right"&gt;
              &lt;li&gt;&lt;a href="timeline-job.html"&gt;Jobs oportunity&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#"&gt;hirring a chief?&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="register-1.html"&gt;login|signup&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;&lt;!-- /.navbar-collapse --&gt;
        &lt;/div&gt;&lt;!-- /.container-fluid --&gt;
      &lt;/nav&gt;

&lt;script&gt;
    var loc = window.location.href;
    $('.navbar ul li a').each(function () {
        var status = loc.indexOf($(this).attr('href')) &gt; -1;
        // $(this).toggleClass('active', status);
        if (status) {
            $(this).addClass('active');
        }
    });
&lt;/script&gt;
</code></pre>

<p>please help, i dont know why my query didnt work</p>