andresgarciadev gracias por tu respuesta. Ya intenté implementarla pero no me funciona,
. Cosas de novato que suelen ser errores simples pero que como no se bien, no puedo verlos.
el script quedó así:
Código:
<script>
$(function(){
$('.puntaje').click(function(){
$(this).prev().removeClass("btn-warning")
$(this).next().removeClass("btn-warning")
})
$('.vote-up').click(function(){
$(this).toggleClass("btn-warning")
$(this).next('.vote-down').removeClass("btn-warning")
});
$('.vote-down').click(function(){
$(this).toggleClass("btn-warning")
$(this).prev('.vote-up').removeClass("btn-warning")
});
});
</script>
el Html relevante:
Código:
<div class = "btn-group-vertical">
<button type="button" class = "btn btn-default vote-up">
<span class="glyphicon glyphicon-chevron-up"></span>
</button>
<button type="button" class = "btn btn-default puntaje">
<h2 class = "numero_puntaje"> {{post.0.votos_positivos}} </h2>
</button>
<button type="button" class = "btn btn-default vote-down">
<span class="glyphicon glyphicon-chevron-down"></span>
</button>
</div>
Cuando doy click al botón vote-down no se remueve la clase "btn-warning" del botón vote-up.
Lo que sí funciona es cuando le doy click al puntaje se quitan las clases "btn-warning" de los dos botones vote-up y vote-down.
Se me ocurre algunas formas de darle vuelta al problema, usando dos prev(), seleccionando todo el div contenedor.. pero creo que no sería la forma más efectiva de lograrlo .Gracias por su ayuda.