Question

关于 li 点击变色的问题，可用JS来解决。

一段很简单的代码：
<ul>
<li><small>文字</small></li>.
...
</ul>
请教一下如何实现这样的效果：点击任意li，只有这个li元素产生变化，比如背景色，li里的small元素也变化，比如改变颜色，重点是只有点击的li产生变化，点击其他li后这个就恢复原来的状态。问题似乎很简单，可查了网上很多类似的问题，都没有很好解决。本人JS基础较差，不知哪位大大能提供一个简单的代码？谢谢了。
谢谢，我测试一下。忘了说一个细节。结构是这样的<li><small>次要文字<small>主要文字</li>，点击li后如何取得子元素small即次要文字要变化，另外才是主要文字的变化。如何取得这个子元素？
我的li结构有好几十个，如果都定义个id会不会复杂了，另外文档中我只取某个div下的li实现这个效果，该怎么写？byid然后再bytagname吗？

Answer 1

<li onclick='g(this.id)' id=w><small>文字</small></li>.
<li onclick='g(this.id)' id=i><small>文字</small></li>.
<li onclick='g(this.id)' id=y><small>文字</small></li>.
<script type=text/javascript>
function g(x)
{
d=document.getElementsByTagName('li')
for(p=d.length;p--;){
if(d[p].id!=x){d[p].style.backgroundColor=''/*其他*/}
else{d[p].style.backgroundColor='red'/*点击的*/}
}
}
</script>

Answer 2

用jquery插件
function a(e){
$("li").css("background","");
e.style.background = "#77777"
}
在li上加onclick = "a(this)"