使用Javascript更改CSS中元素的背景颜色

Question

基本上我想通过点击按钮使用JavaScript更改CSS中元素的背景颜色.

到目前为止我的CSS看起来像这样:

div.box {
    width:100px;
    height:100px;
    background-color:#FF2400;
}

它需要动态变化为多种颜色的选择,只需要多个按钮即可(每种颜色都是不同的颜色).

Answer 1

完成:http://jsfiddle.net/iambriansreed/zmtU4/

更新为非jQuery.

HTML

<div id="box"></div><div id="box"></div>

<button type="button" onclick="button_click('red');">Red</button>
<button type="button" onclick="button_click('blue');">Blue</button>
<button type="button" onclick="button_click('green');">Green</button>
<button type="button" onclick="button_click('yellow');">Yellow</button>
<button type="button" onclick="button_click('purple');">Purple</button>?

纯JavaScript

function button_click(color){
    document.getElementById("box").style.backgroundColor=color;
}?