如何从同级元素中定位和删除类？

Question

因此，如果您单击 Red 类，它应该从 Blue 和 Green 按钮中删除 blue_on 和 green_on 类（如果正在使用它们）。

<div id="dashboard-menu">
    <div id="red" class="red_on">Red</div>
    <div id="blue" class="blue_off">Blue</div>
    <div id="green" class="green_off">Green</div>
</div>

我的代码笔，我试图在一个较小的区域复制我的问题：http ://codepen.io/leongaban/pen/vzolu

我的真实代码供参考

<div id="dashboard-menu">
    <div id="dash-btn" class="dashboard-button-on">
        <div class="icon"></div>
        <span>Dashboard</span>
    </div>

    <div id="dash-btn" class="affiliate-button-off">
    <span>Affiliate Search</span>
    </div>

    <div id="dash-btn" class="wishlist-button-off">
    <div class="icon"></div>
    <div class="count">3</div>
    </div>
</div>

Answer 1

$(this).siblings().removeClass('blue_on green_on');

http://api.jquery.com/removeClass

但是，根据您要完成的任务，更好的方法可能是利用多个（空格分隔的）类：

<div id="dashboard-menu">
    <div class="red on">Red</div>
    <div class="blue">Blue</div>
    <div class="green">Green</div>
</div>

JS：

$(this).addClass('on').siblings().removeClass('on'); // radio-button behavior