jquery - 显示默认图标，如果在div上设置了class，则替换图标

我想创建一个div标记，该标记在左侧具有一个图标，并带有一些文本。

现在使用jquery，如果发生事件，我将一个类添加到此div标记中，以便用另一个图标替换该图标。

我有jquery方面的东西，但我不确定如何通过CSS做到这一点。

我的CSS：

<div id="tag-user" class="usertag selected">Some tag</div>

.usertag
{
    background:url("/Images/tag.png") no-repeat;
}

.usertag .selected
{
    background:url("/Images/tag-selected.png") no-repeat;
}

该图像似乎没有出现，所以我想我的CSS是错误的。

最佳答案

您的班级名称之间有一个空格，应该是

.usertag.selected

因为.selected与.usertag在同一元素上。

.usertag .selected匹配.usertag中具有.selected类的元素。

请注意，多个类选择器在ie6及以下版本中不起作用。如果您需要与下层浏览器兼容，请考虑应用usertag-selected并将CSS更改为

.usertag
{
    background:url("/Images/tag.png") no-repeat;
}

.usertag-selected
{
    background:url("/Images/tag-selected.png") no-repeat;
}

usertag-selected将覆盖稍后声明的usertag。