Estoy realizando un menú sencillo, quiero que se quede seleccionado el elemento del menú en donde haga click. Tengo mi clase activo
y mi codigo de jquery con removeClass
y addClass
.
Al parecer todo bien, pero cuando doy click sobre el elemento del menú, se aplica la clase activo (un borde debajo de las letras) pero inmediatamente se quita, desaparece, solo está visible lo que dura el click.
$(document).ready(function(){
$('.menu nav a').click(function(){
$('nav a').removeClass("activo");
$(this).addClass("activo");
});
});
.activo {
border-bottom: 10px solid white;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="menu">
<nav>
<a href="Inicio.php">Inicio</a>
<a href="Mision.php">Mision</a>
<a href="Vision.php">Vision</a>
<a href="Nosotros.php">Nosotros</a>
<a href="Contacto.php">Contacto</a>
</nav>
</div>