I'm facing an issue where I need to remove the .box class when the .test div is added with the .active class. I've attempted to do this but it doesn't seem to be working. Can anyone provide some insight into what might be causing this problem? Any help would be greatly appreciated.
$(document).ready(function() {
$(".test").on('click', function(e) {
e.preventDefault();
$('.test.active').removeClass('active');
$(this).addClass('active');
});
/* want to achieve this */
/*if ($('.test').hasClass('.active')) {
$('.box').css("opacity", "0");
}*/
});
$(window).load(function() {
$(window).scroll(function() {
$(".box").animate({
'top': '230px'
}, 2000);
});
});.box {
position: absolute;
top: 0;
width: 50px;
height: 50px;
background-color: red;
margin: 0 auto;
position: absolute;
top: 2%;
left: 50%;
}
.test.active {
color: red;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<div class="wrap">
<div class="box"></div>
<div class="testl">
<div class="test">paragraph1</div>
<div class="test">paragraph1</div>
<div class="test">paragraph1</div>
</div>
<div class="testp"></div>
</div>