javascript 点击改变 class 名

Question

怎么实现 点击<标题1> class="a1" 后变为 class="b2" ，之后点击另外一个<标题2>class就变为变为 class="b2" ，<标题1>又变回为 class="a1"。总之就是点击改变class名，点击改变一个class 名 另一个就恢复原来的class名<li class="a1" ><a href="#">标题1</a></li> <li class="a1" ><a href="#">标题2</a></li> <li class="a1" ><a href="#">标题3</a></li>

Answer 1

<script type="text/javascript">
function foo(x)
{
for (var i = 1; i <= 3; i++)
if (x == i)
document.getElementById("l" + i).setAttribute("class", "b1");
else
document.getElementById("l" + i).setAttribute("class", "a1");
}
</script>
<li class="a1" id="l1"><a href="javascript:foo(1)">标题1</a></li>
<li class="a1" id="l2"><a href="javascript:foo(2)">标题2</a></li>
<li class="a1" id="l3"><a href="javascript:foo(3)">标题3</a></li>