php - How to assign a class "active" to the li element based on current URL and click event using jQuery or JavaScript -

i trying create menu class "active" assigned page whenever it's selected , loaded. right applied index page default.

my menu snippet:

<ul class="nav navbar-nav">      <li class="active"><a href="http://localhost/wp/index.php">main</a></li>      <li><a href="http://localhost/wp/news">news</a></li>      <li><a href="http://localhost/wp/contacts">contacts</a></li> </ul> 

try code. working @ end.

<script> jquery(document).ready(function() {     jquery(".nav.navbar-nav li").click(function(){         jquery(".nav.navbar-nav li").removeclass('active');         jquery(this).addclass('active');         }) var loc = window.location.href;  jquery(".nav.navbar-nav li").removeclass('active');     jquery(".nav.navbar-nav li a").each(function() {         if (loc.indexof(jquery(this).attr("href")) != -1) {              jquery(this).closest('li').addclass("active");         }     }); });      </script>  <ul class="nav navbar-nav">      <li class="active"><a href="http://localhost/wp/index.php">main</a></li>      <li><a href="http://localhost/wp/news">news</a></li>      <li><a href="http://localhost/wp/contacts">contacts</a></li> </ul>