jquery - jqueryの現在のメニュー項目の色の変更の問題

Question

デフォルトa:linkおよびa:visited背景色は透明で、色は黒です。次に、a：hoverを指定し、背景を黒、色を白にします。これはうまく機能します。

問題は次のとおりです。背景と色の変更を実行するjqueryスクリプトを挿入しました。私の場合は、背景を黒と色を白に設定します。これは。と同じa:hoverです。このスクリプトは必要なアクションを実行していますが、テキストの色は黒のままです。何か助けはありますか？

コードは次のとおりです。

<ul id="subnav">
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/abc.php" class=”red” onclick=”selected(this)”&gt;<h99>Home<h99/></a></li>
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/asd.php"><h99>Home</h99></a></li>
    <li><a href="http://127.0.0.1:4001/wbdemo/pages/rtz.php"><h99>Home</h99/></a></li> 
    <li><a href="#"><h99>Home</h99/></a></li> 
    <li><a href="#"><h99>Home</h99/></a></li>
</ul> 

<script type="text/javascript">
$(document).ready(function(){
    $('#subnav a').each(function(index) {
        if(this.href.trim() == window.location)
            $(this).addClass("selected");
    });
});
</script>

ul
{ list-style-type: none;
  margin:0;
  padding:0;
  overflow: hidden;
}

ul a:link, ul a:visited
{ display: block;
  width: 240px;
  background-color: tranparent;
  text-align: right;
  text-transform: uppercase;
  text-decoration: none;
  height: 40px;
  color: #000000
}

ul a:hover, .selected
{ background-color: #000000;
  color: #ffffff
}

Answer 1

最後の CSS クラスを 2 つに分割します。

ul a:hover
{ 
  background-color: #000000;
  color: #ffffff;
}

.selected
{ 
  background-color: #000000;
  color: #ffffff !important;
}

または、より単純に!important、最後の行に追加するだけです:

ul a:hover, .selected
{ 
  background-color: #000000;
  color: #ffffff !important;
}

Answer 2

試してみてください

$(this).css('color','coloryouwant')