jquery导航栏点击选中效果

html代码：

<header>
  <div class="navbar-nav">
    <li class="active"><a href="#">首页</a></li>
    <li><a href="#">新闻</a></li>
    <li><a href="#">活动</a></li>
    <li><a href="#">项目</a></li>
  </div>
</header>

style样式代码：

header {
	background-color: #3A94FF;
	color: #FFF;
}
header a{
	color: #FFF;
	text-decoration: none;
}	
li {
	line-height: 50px;
	background-color: #3A94FF;
	display: inline-block;
	padding: 0 20px;
}
li.active {
	background-color: rgba(255,142,0,1.00);
}

js代码：

<script>
    $(document).ready(function (){
        $(".navbar-nav>li").each(function(index){
            $(this).click(function(){
                $("li").removeClass("active");
                $("li").eq(index).addClass("active");
            });
        });
    });
</script>