Pregunta

I'm learning JQuery and when writing my own little scripts, ran into a problem. So I have a navigation bar and each time a button is pressed, it should switch its css class from 'btn' to 'activebtn'. For testing purposes, I would just like to be able to click the SAME button, and have it switch back, although this doesn't happen. Does the JQuery just not update the classes? If this is the case, how would I go about forcing JQuery to do so?

<div class="btn">Hello</div>
<div class="btn">World</div>

<script>
$( ".btn" ).click(function() {
    $(this).removeClass('btn');
    $(this).addClass('activebtn');
});

$( ".activebtn" ).click(function() {
    $(this).removeClass('activebtn');
    $(this).addClass('btn');
});
</script>
¿Fue útil?

Solución

Should just able to do:

$( ".btn" ).click(function() {
    $(this).toggleClass('btn activebtn');
});
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top