Несколько разных popup на одной странице. Как?

Question

[kapost]

Есть скрипт, которым реализовано всплывающее окно на сайте. Но при попытке сделать несколько разных окон на странице, по клику выводится только контент из одного окна. В скриптах практически ноль, потому очень надеюсь на помощь. Пробовал в скрипте прописывать разные классы для каждого блока, но результат именно такой, что выводится только один, на какую бы кнопку не кликал.

Скрипт

// open modal
var wrap = $('#wrapper'),
     btn = $('.open-modal-btn'),
     modal = $('.cover, .modal, .modal_content');

btn.on('click', function() {
  modal.fadeIn();
});

// close modal
$('.modal').click(function() {
  wrap.on('click', function(event) {
    var select = $('.modal_content');
    if ($(event.target).closest(select).length)
      return;
    modal.fadeOut();
    wrap.unbind('click');
  });
});

Answer 1

[yarnstart]

Нужно для каждого инициатора открытия модального окна(кнопки) задать атрибут(в моем примере data-modal, в котором будет храниться идентификатор(например id) нужного вам модального окна, ваш код может выглядеть так - https://jsfiddle.net/jtLvyrco/4/

Comments

[kapost]

Спасибо, но пока очень плохо понимаю js и адаптировать ваш код так и не получилось... Если ли возможность путем незначительных правок запустить имеющийся код? https://jsfiddle.net/6bpqfd1y/

[yarnstart]

kapost, если путём незначительных правок, то так https://jsfiddle.net/gof9j70p/1/ , но лучше учитесь делать правильно, это не более, чем костыль. Не создавайте лишние дублирующиеся классы.

[kapost]

Евгений, спасибо! Конечно, нужно учиться, пока набиваю шишки))