如何在点击三个div后删除类？

Question

我有9个div。当我点击每个div时，我将添加“活动”类。我需要删除“活动”类当我点击任何的div作为第四

<section class="square_box tctgrid" id="question1"> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div class="empty"><input type="radio" value="1" class="answer_value"></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 
    <div></div> 

<script> 
$(".square_box div").click(function() { 
    if ($(this).hasClass("empty")) { 
     var ans = $(this).find('.answer_value').val(); 
     $(this).addClass("active"); 
    } 
    else{ 
     $(this).addClass("active").addClass('error_div');; 
    } 
}); 
</script> 

上面的代码是我的脚本。我不知道如何删除课程。请帮助我解决这个问题。

Answer 1

尝试是这样的：

$(document).ready(function() { 
    $("div").each(function() { 
    $(this).data('count', 0); 
    } 
    $("div").click(function() { 
    $(this).data('count', ($(this).data('count') +1)); 
    if($(this).data('count') == 4) { 
     $("div").removeClass("active"); 
     $(this).data('count', 0); 
    } 
    }); 
}); 

Answer 2

如果承担您的权利，这应该解决您的要求。

$(".square_box div").click(function() { 
    $(".square_box div .active").removeClass("active"); 
    //handle the rest of you methods 
}); 

Answer 3

你能做到这样

$(document).ready(function(){ 
 
    $("div").click(function(){ 
 
    $("div").removeClass("active"); 
 
    $(this).addClass("active"); 
 
    }); 
 
});

div{ 
 
    cursor:pointer 
 
} 
 
.active{ 
 
    font-weight:bold 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div></div> 
 
    <div>ONE</div> 
 
    <div>TWO</div> 
 
    <div>THREE</div> 
 
    <div>FOUR</div> 
 
    <div>FIVE</div> 
 
    <div>SIX</div> 
 
    <div>SEVEN</div> 
 
    <div>EIGHT</div>