Javascript 选择按钮时如何更改按钮的颜色？

我有一个按钮网格，如果用户点击一个按钮，按钮的值就会进入只读文本框。我想要的是，我无法工作的是，我希望从网格中选择的按钮变为绿色，所有其他未选择的按钮保持不变的颜色。其原因是，如果用户在任何时候打开网格，他们都可以看到当前通过按钮上的颜色更改选择的按钮。如果选择了另一个按钮，则先前选择的按钮将变为白色，而新选择的按钮将变为绿色

有人知道怎么做吗

我当前的代码在JSFIDLE中。点击

---

谢谢

首先使用jQuery订阅活动

$(function() {
    $('#showGrid').click(function(e) {
        if ($('#optionTypeTbl').css("display") == "table") {
            $('#optionTypeTbl').hide();
        }
        else {
            $('#optionTypeTbl').css("display", "table");
        }
        e.stopPropagation();
    });

    $("body").click(function() {
        $('#optionTypeTbl').hide();   
    });

    $('#optionTypeTbl input').click(function() {

        // update value
        $('.box INPUT').val($(this).val())
        $('#optionTypeTbl').hide();

        // update ui class
        $('#optionTypeTbl input.gridBtnsOn').removeClass('gridBtnsOn').addClass('gridBtnsOff');
        $(this).addClass('gridBtnsOn');
    });

});

代码：

另外，我对样式做了一些更改。

只需添加以下内容：

  $(".gridBtns").removeClass("gridBtnsOn");
  $(this).addClass("gridBtnsOn");

---

你可以像我在这把小提琴上做的那样

---

“正确”的方法是使用单选按钮，因为（与reguler按钮不同）它们旨在突出显示当前选定的一个。嗨，谢谢大家的回答，所有这些答案都可以在我的应用程序中使用。我选择buddhabrot答案，因为它只是添加了两行代码，但任何答案都适用于我的应用程序，所以谢谢大家

function buttonclick(button)
{

    $('input:button').css('background-color', 'transparent');
    $(button).css('background-color', 'green');
    if (button.className=="gridBtnsOn")
    {
        button.className="gridBtnsOff";
        return false;
    }

    if (button.className=="gridBtnsOff")
    {
        button.className="gridBtnsOn";
        return false;
    }
}