jquery - Jquery：.css 颜色覆盖：悬停

Question

<script>
            $(document).ready(function(){
            $("#dicks1").click(
                function(){
                $("header ul li").css("color", "#fff");
                $("#dicks1").css("color", "#ce0000");
            });
            $("#dicks2").click(
                function(){
                $("header ul li").css("color", "#fff");
                $("#dicks2").css("color", "#ce0000");
            });
            $("#dicks3").click(
                function(){
                $("header ul li").css("color", "#fff");
                $("#dicks3").css("color", "#ce0000");
            });

            });
            </script>

我正在努力做到这一点，所以当我单击“li”时，它会变为红色并保持红色，除非单击另一个，但是 li 上的：悬停被删除并且它保持白色而不是变成＃111。

我尝试了另一个带有 .hover 的脚本，并尝试了一个 if 语句，但它们都失败了。我在这里缺少什么吗？

这是页面：http ://web-owl.com/cockslam/

Answer 1

!important您可以在悬停规则旁边添加声明：

li:hover{
    color:#111 !important;
}

这样它就不会被添加的内联样式覆盖.css