How to make an element collapse when opening another?

Question

JavaScript

Good day,
A smart filter is implemented on the site and everything works as it should, except for one, it is necessary that when you click on the filter type, say Season, the previously opened filter type, for example, Price, is folded. Collapse on the filter is implemented when clicking on the area outside the filter as follows:

$(document).ready(function() {
  $(".button span").click(function() {
    $('.hover-box').toggle();
  });
  $(document).on('click', function(e) {
    if (!$(e.target).closest(".title-antfas").length) {
    $('.hover-box').hide();
    } 
    e.stopPropagation();
  });		
});

Please advise how to make this possible.

Answer 1

Run through all the tabs and remove the class="hover-box" from them (which is responsible for the expanded tab) and assign it at the end of the code to that short tab should be open. Assignment via $(this).addClass('hover-box') Pretty
quick solution
$(document).on('click', '.hover-box', function(e) {