javascript - Switch active tab with Bootstrap's Navbar -

i'm using bootstrap's navbar website. i've separated navbar own html page. when page loaded, load navbar.html page jquery. when user clicks on say, page2, "home" link still shown active when should "page2".

is there simple way switch class page2 link "active" using javascript, jquery or bootstrap magic?

navbar.html

<ul class="nav">     <li class="active"><a href="#l">home</a></li>     <li><a href="#">page2</a></li> <li><a href="#">page3</a></li> </ul> 

jquery on page2

<script>     jquery(function(){         $('#nav').load('nav.html');     });      jquery(function(){         $('.nav a:contains("page2")').addclass('active');     }); </script> 

using jquery:

$('.nav a:contains("page2")').addclass('active'); 

or, add class parent element (li):

$('.nav a:contains("page2")').parent().addclass('active'); 

live example:

http://jsfiddle.net/bdtnj/