Zmiana koloru tła przycisków html w przód i tył po kliknięciu - javascript, html

Jestem nowy w JavaScipt i HTML i potrzebuję go tylko jako problem uboczny. Mam kilka przycisków i chcę, aby ich kolor tła zmienił się po kliknięciu. To mogę rozwiązać częściowo za pomocą:

<input class="choice" onclick="this.style.background="blue";" type="submit" value="V" id="0" />

Jednak gdy przycisk zostanie kliknięty po raz drugi, powinien zmienić się z powrotem. Najlepiej byłoby, gdyby była to instrukcja jednowierszowa, jak powyżej. Byłbym wdzięczny za każdą pomoc.

Odpowiedzi:

Rozbiłem twój kod na osobny JS, jest czystszy w ten sposób i łatwiejszy w utrzymaniu.

Jeśli wyłączysz przycisk, przestanie on otrzymywać zdarzenia kliknięcia. Zakładam, że nie tego chcesz.

Tutaj zrobiłem to tak, że po kliknięciu przycisku przełącza kolor tła z czerwonego na niebieski.

http://jsbin.com/huqoyixuhe/edit?html,css,js,output

// select the button
var input = document.querySelector("input.choice");
// add a click event listener
input.addEventListener("click", function () {
// if the button is red, make it blue
if (this.style.background === "red") {
this.style.background = "blue";
}
// otherwise, it is already blue, so make it red!
else {
this.style.background = "red";
}


});

EDYTOWAĆ

tutaj, jako jednowierszowy: http://jsbin.com/bolowuceqa/edit?html,output

<input class="choice" onclick="this.style.background==="red" ? this.style.background = "blue" : this.style.background = "red"" style="background:red;" type="submit" value="V" id="0" />