JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.3.1/jquery.cookie.min.js"></script>
<div id="info">
<p>Текст баннера <span id="info-hide">×</span></p>
</div>
<span id="delete_cookie">Удалить печеньку</span>
CSS
#info { display: none; }
#info-hide { color: red; font-weight: bold; font-size: 20px; cursor: pointer; }
#delete_cookie { text-decoration: underline; cursor: pointer; }
JavaScript
// Проверяем наличие и соответствие куки содержимому параграфа
if ($.cookie('viewed_banner') != $('#info p').text()) {
// если куки нет или её содержимое отличается от текущего текста
// то показываем баннер
$('#info').show();
// и устанавливаем кнопке «скрыть» обработчик клика,
$('#info-hide').on('click', function() {
// который прячет баннер и
$('#info').hide();
// устанавливает на 365 дней куку с тектовым содержимым параграфа
$.cookie('viewed_banner', $('#info p').text(), { expires: 365 });
});
}
$('#delete_cookie').on('click', function() {
$.removeCookie('viewed_banner');
})