How to remove all classes except one Jquery?

There are three columns. When you hover with the mouse $(this) is highlighted with extra classes, when mouseleave returns to its original state.

But one column is initially highlighted, and additional classes to this html. The question how to make so that when you hover over another column, one that was highlighted originally, became again inactive, i.e. he was removed classes.

Now it turns out that when you hover over other bars, active continues to illuminate in spite of everything, that in other it and logical

$(".price__column").on("mouseenter mouseleave", () => {
$(event.currentTarget).toggleClass("price__column_active");
$(event.currentTarget)
.find(".column__period")
.toggleClass("column__period_active");
$(event.currentTarget).find(".button").toggleClass("button_active");
 });
April 19th 20 at 12:30
2 answers
April 19th 20 at 12:32
Solution
$('.price__column').each(function(){ 
 $('.price__column').removeClass('column__period_active'); 
});


Hover first, remove all active classes, then add to the fact that led
April 19th 20 at 12:34

Find more questions by tags jQuery