javascript - javascript复选框

大家！
我要执行以下操作：单击复选框时，一个或多个div标签必须更改其css样式。我有这个小javascript：

function changeStyle(o) {
    if(o.checked) {
        document.getElementById(o.getAttribute("value")).setAttribute('class','on');
    }
    else {
        document.getElementById(o.getAttribute("value")).setAttribute('class','off')
    }
}

和的HTML是：

<input type="checkbox" onclick="changeStyle(this);" value="div1" />&nbsp;Div1<br />
<input type="checkbox" onclick="changeStyle(this);" value="div2" />&nbsp;Div2<br />
<input type="checkbox" onclick="changeStyle(this);" value="div3" />&nbsp;Div3<br />
<input type="checkbox" onclick="changeStyle(this);" value="div4" />&nbsp;Div4<br />
<input type="checkbox" onclick="changeStyle(this);" value="div5" />&nbsp;Div5<br />

<div id="div1" class="off">I'm in div 1</div><br />
<div id="div2" class="off">I'm in div 2</div><br />
<div id="div3" class="off">I'm in div 3</div><br />
<div id="div4" class="off">I'm in div 4</div><br />
<div id="div5" class="off">I'm in div 5</div><br />
<div id="div2" class="off">I'm in div 2</div><br />

但是在这种情况下，当我有多个具有相同ID的div时，只有第一个div的样式从.on更改为.off

当我单击复选框以将css样式更改为具有与复选框值相同的id的所有div标签时，该如何做？

先感谢您！

最佳答案

如果id使用必须像这样工作的class属性，则id必须始终是唯一的

> <div class="div1 off">I'm in div 1</div><br />