Pessoal gostaria de criar uma função em javascript que quando o usuário clicar em algum item do menu o mesmo fica com o active, fiz algumas pesquisa na internet mas não consegui reproduzir em meu código.
<nav class="site-menu">
<ul id="nav">
<li >
<a asp-controller="Home" asp-action="Index" onclick="mostrarAtivo"><span>Home</span></a>
</li>
<li >
<a asp-controller="QuemSomos" asp-action="Index" onclick="mostrarAtivo"><span>Quem Somos</span></a>
</li>
<li onclick="mostrarAtivo">
<a><span>Lançamentos</span></a>
<ul class="sub-menu">
<li><a asp-controller="Imoveis" asp-action="Casas">Casas</a></li>
<li><a asp-controller="Imoveis" asp-action="Apartamentos">Apartamentos</a></li>
<li><a asp-controller="Imoveis" asp-action="SalasComercial">Salas Comerciais</a></li>
</ul>
</li>
<li onclick="mostrarAtivo">
<a><span>Imóveis</span></a>
<ul class="sub-menu">
<li><a asp-controller="Imoveis" asp-action="Alugar">Alugar</a></li>
<li><a asp-controller="Imoveis" asp-action="Comprar">Comprar</a></li>
</ul>
</li>
<li>
<a asp-controller="CadastroImovel" asp-action="Proprietario"><span>Cadastre seu imóvel</span></a>
</li>
<li>
<a href="components/accordion.html"><span>Contato</span></a>
</li>
</ul>
</nav>
js:
<script>
function setActive() {
aObj = document.getElementById('li').getElementsByTagName('a');
for (i = 0; i < aObj.length; i++) {
if (document.location.href.indexOf(aObj[i].href) >= 0) {
aObj[i].className = 'active';
}
}
}
</script>
Basicamente é o usuário clicar e ativar o active do bootstrap