Css jQuery切换活动状态

我正在我的页面上实现这个切换，希望切换按钮在激活时保持橙色。请查找下面使用的CSS和jQuery代码。 我相信这是很容易做到的。希望有人能帮助我。 谢谢；）

---

将另一个类添加到span元素

在CSS中，为跨度添加类选择器，与悬停选择器相同：

.activetoggle, .toggle-view li:hover span {
    background: none repeat scroll 0 0;
    background:#F63;
    color:#fff;
}

在javascript中添加：

$(this).children('span').toggleClass('activetoggle');

我想这可能行得通

这里有一点简化

---

更新：我用您的标记和代码更新了JSFIDLE，现在在

li

元素上切换类

$('.toggle-view li').click(function () {
        var text = $(this).children('div.toggle-content');
        if (text.is(':hidden')) {
            text.slideDown('200');
            $(this).children('span').html('<i class="icon-minus"></i>');    
        } else {
            text.slideUp('200');
            $(this).children('span').html('<i class="icon-plus"></i>');    
        }    
        $(this).toggleClass('activetoggle');
});

$（'.toggle view li'）。单击（函数（）{
var text=$（this.children（'div.toggle-content'）；
if（text.is（'：hidden'））{
文本。向下滑动（“200”）；
$（this.children（'span'）.html（''）；
}否则{
text.slideUp（'200'）；
$（this.children（'span'）.html（''）；
}    
$（this.toggleClass（'activetoggle'）；
});

为了简化一切，CSS选择器现在是

.activetoggle span

---

谢谢。我试过了，但没用。我应该把jQuery的那一行放在哪里？嗯，它不起作用。对于加号和减号图标，我使用的是图标字体。这是我正在使用的html：

• Togle 2在这里切换内容2

哦，好的，我现在要测试一下。谢谢。。。我没有字体，所以我只是在。。。但现在我用你网页上的所有东西更新了它。。。这对我很有用。。。您是否尝试过更新的JSFIDLE？只需将jQuery中的部分更改回

和

，它就可以工作了。。。我在html和jQuery中更改了它。。。所以它对我有用。。。它们只需要是相同的=）我用您现在应该使用的确切代码更新了答案。

$(this).children('span').toggleClass('activetoggle');

$('.toggle-view li').click(function () {
        var text = $(this).children('div.toggle-content');
        if (text.is(':hidden')) {
            text.slideDown('200');
            $(this).children('span').html('<i class="icon-minus"></i>');    
        } else {
            text.slideUp('200');
            $(this).children('span').html('<i class="icon-plus"></i>');    
        }    
        $(this).toggleClass('activetoggle');
});