Есть на странице по умолчанию блоки с работающей кнопкой закрытия, но если добавлять новые через скрипт то у них уже почему то не работает эта кнопка закрытия.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Notifications</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="popup-wrapper">
<div class="popup color-red">
<p>Блок с уведомление 1</p>
<span class="close"></span>
</div>
<div class="popup color-green">
<p>Блок с уведомление 2</p>
<span class="close"></span>
</div>
<div class="popup color-yellow">
<p>Блок с уведомление 3</p>
<span class="close"></span>
</div>
<div class="popup color-blue">
<p>Блок с уведомление 4</p>
<span class="close"></span>
</div>
</div>
<button id="notifications" text="Текст уведомления">Добовить блок</button>
<script src="jquery.min.js"></script>
<script src="main.js"></script>
</body>
</html>
$('#notifications').click(function () {
text = $(this).attr('text');
$('.popup-wrapper').append('<div class="popup"><p>'+text+'</p><span class="close"></span></div>');
})
$('.close').click(function () {
$(this).parent().toggle();
})