小白求助，关于按钮点击更换背景的问题

单击按钮时，改变其背景图片。当另一个按钮被点击时，原先的按钮恢复初始状态，现被点击的那个改变，图片数量没有具体限制

把html代码发上来，不然不知道你这些按钮之间的关系。另请把需求再描述的清楚一点

首先给两个按钮都设置id属性，比如id1,id2。id1的原来图片为1.jpg.点击后的图片为2.jpg.id2的原来图片为3.jpg,点击后的图片为4.jpg
点击id1按钮的事件
$(function(){
$("#id1").click(function(){
$(this).css("background-image","url(2.jpg)");
})
$("#id2").click(function(){
$("#id1").css("background-image","url(1.jpg)");
$(this).css("background-image","url(4.jpg)");
})

})

补充一下问题吧

以上是我的按钮，上面的click是点击跳转用的
效果图如下
图片说明

你采用我上面说的方法，然后进行相应图片路径和按钮id修改就能实现的

   <div class="ot-menu" id="scroller">
        <ul>
            <li><img onclick="selectInfo(1)" src="../imgClassification/one1a.jpg"></li>
            <li><img onclick="selectInfo(2)" src="../imgClassification/one2a.jpg"></li>
            <li><img onclick="selectInfo(3)" src="../imgClassification/one3a.jpg"></li>
            <li><img onclick="selectInfo(2)" src="../imgClassification/one4a.jpg"></li>
            <li><img onclick="selectInfo(3)" src="../imgClassification/one5a.jpg"></li>
            <li><img onclick="selectInfo(1)" src="../imgClassification/one1a.jpg"></li>
            <li><img onclick="selectInfo(2)" src="../imgClassification/one2a.jpg"></li>
            <li><img onclick="selectInfo(3)" src="../imgClassification/one3a.jpg"></li>
        </ul>
    </div>

radiogroup+radiobutton可以搞定

做一张纯白色的背景图片，假设命名为bg.jpg;其他背景图片依次命名为 p0.jpg,p1.pjg,p2.jpg.........
jquery代码：

 $('#scroller ul li').each(function(index,domEle){
     var url='url(p'+index+'.jpg)';
     $(this).click(
            $(this).siblings()..css('background-image','url(bg.jpg)');
            $(this).css('background-image',url);
     );
 });

手残，css前面多了一个".",请把它去掉

贴出你的代码或参照楼上给出的代码示例！

楼上的代码我借鉴了一下，稍作修改发现点击没有反应，贴上全部代码再帮忙看看，

 <!DOCTYPE html >
<head>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>xxxx</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta http-equiv="Content-Type" content="text/html" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0 , maximum-scale=1.0, user-scalable=0">
    <script src="jquery-1.10.1.min.js"></script> 
</head>
<style>

</style>
<script>
window.onload=function(){
 $('#scroller ul li').each(function(index,domEle){
     var url='url(p'+index+'.jpg)';
     $(this).click(
            $(this).siblings().css('background-image','url(pb.jpg)');
            $(this).css('background-image',url);
     );
 });
 }
</script>

<body>

 <div class="ot-menu" id="scroller">
        <ul>
            <li><img  src="img/p1.jpg"></li>
            <li><img  src="img/p2.jpg"></li>
            <li><img  src="img/p3.jpg"></li>
            <li><img  src="img/p4.jpg"></li>
            <li><img  src="img/p5.jpg"></li>
            <li><img  src="img/p1.jpg"></li>
            <li><img  src="img/p2.jpg"></li>
            <li><img  src="img/p3.jpg"></li>
        </ul>
 </div>

</body>

</html>