Скрыть div при нажатии за его пределами

Этот вопрос задавался несколько раз, однако ни один из ответов, похоже, не работает для меня.

CSS div выглядит следующим образом:

#info{
  display: none;
  position: fixed;
  z-index: 500;
  height: 50%;
  width: 60%;
  overflow: auto;
  background: rgba(187, 187, 187,.8);
}

Я попытался использовать следующий код:

$("#info").click(function(e){
  e.stopPropagation();
});

$(document).click(function(){
  $("#info").hide();
});

а также этот код:

$(document).mouseup(function (e){
    var container = $("#info");

    if (container.has(e.target).length === 0) {
        container.hide();
    }
});

Тем не менее, всякий раз, когда я нажимаю на div, он также исчезает, не знаю, почему, но это так.
Что-нибудь еще, что может сработать?