Оповещение о копировании текста

Всем привет.

Есть рабочий код, который копирует текст в буфер обмена по клику мышью. Но оповещение о том, что текст скопирован выводится с помощью alert, что меня категорически не устраивает. Не подскажите, как вывести оповещение в виде обычного сообщения, которое само удалится через несколько секунд и/или после нажатия на крестик?

Прошу строго не судить, в JS я полный ноль...

jQuery(document).ready(function($) {
  $('.copy-code').click(function() {
    var $text_copy = $(this);
    var $temp = $("<input>");
    $("body").append($temp);
    $temp.val($text_copy.text()).select();
    document.execCommand("copy");
    alert("Промокод скопирован");
    $temp.remove();
    $('.copy_link_mess').fadeIn(400);
    setTimeout(function() {
      $('.copy_link_mess').fadeOut(400);
    }, 5000);
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="copy-code" id="text">SALE25</span>


Ответы (1 шт):

Автор решения: Алексей Шиманский

jQuery(document).ready(function($) {
  $('.copy-code').click(function() {
    var $text_copy = $(this);
    var $temp = $("<input>");
    $("body").append($temp);
    $temp.val($text_copy.text()).select();
    document.execCommand("copy");
    
    $temp.remove();
    $('.copy_link_mess').fadeIn(400);
    setTimeout(function() {
      $('.copy_link_mess').fadeOut(400);
    }, 2000);
  });
});
.copy_link_mess {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="copy-code" id="text">SALE25</span>
<div class="copy_link_mess">Промокод скопирован</div>

→ Ссылка