从多个元素中删除类

Question

我有一长串所有具有唯一ID的元素，我希望能够通过点击它们来切换它们。 因此，如果元素打开，则类为“plus on”，而其他每个元素都将为“plus”。 但是，我无法将先前点击的元素恢复为“加号”。 这是我的代码不起作用：

$(".plus").on("click", function () {
    $(".plus").removeClass("on");
});

这部分确实有效，可以打开元素：

        function switch(elem) {
        var elem = document.getElementById(elem);
        elem.className = 'plus on';
        }

我尝试将click功能置于内部，然后在切换功能之前，但我无法获得任何工作。

Answer 1

要在同一个类的元素之间进行简单的切换，您可以通过保留当前选定的元素来使用更有效的方法：

var $current = null;

$('.plus').on('click', function() {
    if ($current) {
        $current.removeClass('on');
    }
    $current = $(this).addClass('on');
}

正如评论中所提到的，如果动态添加元素，最好使用事件委托; 例如：

$(document).on('click', '.plus', function() {

重要提示：而不是document ，你应该选择那是你的节点，将无法从文档中删除的祖先的元素。

Answer 2

$(".plus").on("click", function () {
    $(this).toggleClass("on");
});

可能是你的意思，通过切换类来适用于当前点击的元素

Answer 3

尝试这个 ：-

$(".plus").on("click", function () {
    $(".on").each(function(){
        $(this).removeClass("on");
    });
    $(this).addClass("on");
 });