Question

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

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


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

In the code above, I’m trying to make the color of the link to change when clicking on it, while other links stay in white color, however these other links should have a mouse-over event that changes the color from white to #FF8400 on mouse-over. Any Ideas?

Answer 1

Why not try a combination of CSS and basic jQuery (see http://jsfiddle.net/wUgN8/)

CSS:

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

jQuery:

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