Current class on nav

:)

by Megi93

HTML

<nav class="navbar navbar-default" role="navigation">
        <ul class="nav navbar-nav">                      
          <li>Clients</li>
          <li>Services</li>
          <li>Add</li>
          <li>Time</li>
        </ul>
</nav>

CSS

* {
	margin: 0px;
	padding: 0px;
}

nav {
	background-color: #e4801c;
	height: 100%;
}
.nav > li {
	text-align: center;
	text-transform: uppercase;
}

.current {
	background: #faaf5e;
}

JavaScript

var list = document.querySelector('nav').querySelectorAll('li');
for(var i = 0; i < list.length; i++) {
	list[i].onclick = function() {
		if(document.querySelector('nav').querySelector('li.current')) {
			document.querySelector('nav').querySelector('li.current').className = "";
		}
		this.className = "current";
	}
}