jquery - 为什么我不能更改活动导航元素的背景？

Question

我正在尝试使活动导航选项卡的背景颜色变为白色，而活动超链接文本应同时变为黑色。在这种情况下，“活动”是指用户所在的当前页面。

为此，我使用 jquery 添加一个 .selected 类

$(document).ready(function () {
    $('.navbar a').each(function (index) {
        if (this.href.trim() == window.location) $(this).addClass("selected");
    });
});

目前，没有 .selected 类的每个导航元素的 css 是：

.navbar a {
    color:#FFFFFF;
    padding:10px 10px 0 10px;
    margin-left:5px;
    margin-right:5px;
    background-color:#404040;
    border-radius: 10px 10px 0 0;
}

.selected 类的 css 是：

.selected {
    background-color: #FFFFFF;
    color:#404040;
}

但是，它不起作用。

这是我的jsfiddle。

http://jsfiddle.net/m9YfG/1/

Answer 1

为选择器添加更多权重/特异性：

.navbar a.selected { background-color: #FFFFFF; }

或者，添加!important指令：

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