Q:

Скрытие элемента при клике вне него

Данный код скрывает элемент .header__bottom-hover-menu, при клике вне него. 

$(function() {

  $('.header__nav-item').click(function() {
    if (window.innerWidth > 1150) {
      let overlay = $('.overlay');

      $('.header__bottom-hover-menu.active, .header__top, .header__bottom').removeClass('active');
      $('.header__nav-item > a.active').removeClass('active');
      overlay.removeClass('active');

      if ($(this).find('.header__bottom-hover-menu').length > 0) {
        $('a.submenu').addClass('active');
        $('.header__top, .header__bottom').addClass('active');
        overlay.addClass('active');
      }
    }
  }, function() {
    if (window.innerWidth > 1150) {
      $('.header__bottom-hover-menu.active, .header__top, .header__bottom').removeClass('active');
      $('.overlay').removeClass('active');
      $('.header__nav-item > a.active').removeClass('active');

      $('.header__hover-list-item.active').removeClass('active');
      $('.header__hover-tab.active').removeClass('active');

      $(this).find('.header__bottom-hover-menu').addClass('active');
      $('.header__hover-list-item[data-tab="1"]').addClass('active');
      $('.header__hover-tab[data-tab="1"]').addClass('active');
    }
    return false
  });
  $(document).on('click', function(e) {
    var myDiv = $(".header__bottom-hover-menu");
    if (! myDiv.is(e.target) && myDiv.has(e.target).length === 0) {
      $('.header__bottom-hover-menu').hide();
    }
  })
});

но этот элемент ранее сам появлялся при клике на пункт меню, и теперь, после того как он пропал, обратно он не появляется при клике на пункт меню. 
Как сделать так, чтобы можно было кликнуть на пункт меню - появился элемент, кликнул вне - исчез.  И так по всем пунктам, без перезагрузки страницы. 

A:

Вам нужно выполнить следующий код, чтобы элемент опять появился
$('.header__bottom-hover-menu').show();

При обработчике клика можно контролировать когда элемент должен появится, а когда исчезать.