[Dilettante_Pro]

Мой вариант без недостатка вроде живой

<style>
.popup {
  position:fixed;
  top:40%;
  left:40%;
  display:none;
  font-size: 20pt;
  background-color:lightgreen
}
</style>
<button id='i1' value='0'>Mess1</button>  <!-- value - индекс для сообщения -->
<button id='i2' value='1'>Mess2</button>
<button id='i3' value='2'>Mess3</button>
<button id='i4' value='3'>Mess4</button>
<div class='popup'></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
messages =['Сообщение 1','Сообщение 2','Сообщение 3','Сообщение 4'];  // набор сообщений
$('button').on( "click" , function(e) {              // клик по кнопке
                
    $('.popup').css('display','block');               // показ блока
    $('.popup').text(messages[$(this).val()]);   // вставка нужного сообщения в блок
       setTimeout(                                       // ksa сказал зачем 
            function ()
            {
                 $('body').on('click', closePopup)  // включение закрытия по клику везде
            }
        );
        return false;    
});
function closePopup(event) {           // описание закрытия по клику везде
  var obj=event.target||event.srcElement; // кликнутый элемент
  if ($(obj).hasClass('popup'))  return;      // кроме клика по popup
  $('.popup').css('display','none');            // закрытие блока
  $('body').off('click', closePopup);           // выключение закрытия по клику везде
};

</script>