function switchPopups (neededPopupOption) { $('.hiddable-popup-option').addClass('hidden-popup-type'); $('#'+neededPopupOption).removeClass('hidden-popup-type'); } function showPopup(){ $('.popup-flex').removeClass('hiddable-container'); } function hidePopup(){ $('.popup-flex').addClass('hiddable-container'); $('.hiddable-popup-option').addClass('hidden-popup-type'); } /* * Event listener that's close the popup when user clicks out of a popup. */ window.addEventListener( 'click' , (clickedElement) => { if(!document.getElementById('popup-body').contains(clickedElement.target) && clickedElement.target.className == 'popup-flex' ) { hidePopup(); } } ); $('.popup-button-close').click( () => { hidePopup(); $('.hiddable-popup-option').addClass('hidden-popup-type') } );