Jquery 如何将鼠标悬停事件添加到兄弟节点？

在上面的代码中，我试图在单击链接时更改链接的颜色，而其他链接保持白色，但是这些其他链接应该有一个鼠标悬停事件，在鼠标悬停时将颜色从白色更改为#FF8400。有什么想法吗？

类似这样的想法：

$( "#menu li" ).each(
        function(){
            $( this ).bind (
                "click",
                function(){

$(this).css("color","#FF8400");
$(this).siblings().css("color","white");


var page = $(this).attr("id");

或

试试这个：

$(this).siblings().bind('mousein', function(){
    $(this).css("color","#FF8400");
}).bind('mouseout', function(){
    $(this).css("color","white");
});

---

为什么不尝试组合使用CSS和基本jQuery（请参阅）

CSS:

jQuery：

li { color: white; }
li:hover, li.on { color: #FF8400; }

---

谢谢，但实际上，这不会产生鼠标悬停的效果！我有三个

，我想做的是，当用户点击一个li时，它的颜色变为#FF8400，然后，如果用户在其他两个li上移动鼠标，它们的颜色变为#FF8400，在鼠标离开时，它会恢复为白色，而第一次点击的链接仍然是#FF8400。当点击另一个链接时，同样的过程会继续进行。@MohamedSaid让我们感谢，第二个代码完成了这项工作，但是在查看第一个链接后选择另一个链接时，第二个链接的颜色不会变为#FF8400。太棒了，这正是我想要做的：）

$( "#menu li" ).bind ("click", function(){
    $( "#menu li" ).css("color","white").removeClass("active");
    $(this).css("color","#FF8400").addClass("active");
    var page = $(this).attr("id");
    //Do Something
    .
    .
    .
})

$( "#menu li" ).hover (function(){
      var $this = $(this);
        if(!$this.hasClass("active")){
            $this.css("color","#FF8400");
      }
}, function(){
    var $this = $(this);
    if(!$this.hasClass("active")){
       $this.css("color", "white"); 
    }
});

li { color: white; }
li:hover, li.on { color: #FF8400; }

$( "#menu li" ).bind ("click", function(){
   $("#menu li").removeClass("on");
   $(this).addClass("on");
   var page = $(this).attr("id"); });