JavaScript单击的按钮颜色

我希望我的按钮在单击其中一个时变为一种特定的颜色，然后在单击另一个按钮时又恢复为默认颜色。默认颜色为灰色，然后单击一个按钮时，它将保持橙色，直到单击另一个按钮。我不确定如何实现这一目标。

为此需要使用香草JS，因此我无法使用jQuery

这是HTML和JS：

<button type="button" id="button1">1</button>
    <button type="button" id="button2">2</button>
    <button type="button" id="button3">3</button>

...

var userRating

document.getElementById('button1').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 1;
}
document.getElementById('button2').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 2;
}
document.getElementById('button3').onclick = function () {
    console.log(this.id + " was clicked")
    userRating = 3;
}

这是CSS：

button {
    -moz-box-shadow: 0px 10px 14px -7px #AAAAAA;
    -webkit-box-shadow: 0px 10px 14px -7px #AAAAAA;
    box-shadow: 0px 10px 14px -7px #AAAAAA;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #AAAAAA), color-stop(1, #AAAAAA));
    background:-moz-linear-gradient(top, #AAAAAA 5%, #AAAAAA 100%);
    background:-webkit-linear-gradient(top, #AAAAAA 5%, #AAAAAA 100%);
    background:-o-linear-gradient(top, #AAAAAA 5%, #AAAAAA 100%);
    background:-ms-linear-gradient(top, #AAAAAA 5%, #AAAAAA 100%);
    background:linear-gradient(to bottom, #AAAAAA 5%, #AAAAAA 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#AAAAAA', endColorstr='#AAAAAA',GradientType=0);
    background-color:#77b55a;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    border:1px solid #4b8f29;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:13px;
    font-weight:bold;
    padding:6px 12px;
    text-decoration:none;
    text-shadow:0px 1px 0px #5b8a3c;
}
button:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #FF851B), color-stop(1, #FF851B));
    background:-moz-linear-gradient(top, #FF851B 5%, #FF851B 100%);
    background:-webkit-linear-gradient(top, #FF851B 5%, #FF851B 100%);
    background:-o-linear-gradient(top, #FF851B 5%, #FF851B 100%);
    background:-ms-linear-gradient(top, #FF851B 5%, #FF851B 100%);
    background:linear-gradient(to bottom, #FF851B 5%, #FF851B 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF851B', endColorstr='#FF851B',GradientType=0);
    background-color:#FF851B;
}
button:active {
    position:relative;
    top:1px;
}

如果您能指出正确的方向，那就太好了！我对这些东西很陌生。