Как сделать сравнение?

Question

[drtvader]

Привет!
Как можно сделать сравнение строки?
У меня есть несколько попапов.
Вызываются ссылкой с одинаковым классом, у попапов тоже классы одинаковые.
Пока надумал что сделать как-то сравнение по data-id.

$('.js-open-popup').bind("click", function(){
        $(".js-popup-wrapper").fadeIn().addClass('active');
    });

<a href="javascript:void(0);" title="" class="b-advantage__plus-link js-open-popup" data-id="1"></a>
   <a href="javascript:void(0);" title="" class="b-advantage__plus-link js-open-popup" data-id="2"></a>
   <a href="javascript:void(0);" title="" class="b-advantage__plus-link js-open-popup" data-id="3"></a>
    <a href="javascript:void(0);" title="" class="b-advantage__plus-link js-open-popup" data-id="4"></a>
   <div class="js-popup-wrapper">
         <div class="b-advantage__item" data-id="1"></div>
         <div class="b-advantage__item" data-id="2"></div>
         <div class="b-advantage__item" data-id="3"></div>
         <div class="b-advantage__item" data-id="4"></div>
   </div>

Добавляю для внешней обертки класс с появлением ($(".js-popup-wrapper").fadeIn().addClass('active');)
Внутри есть еще блоки, к которым в соответствии с нажатой ссылкой должен добавляться еще класс.
Так вот, как мне дальше лучше делать?

UPD:

$('.js-open-popup').bind("click", function(){
        $(".js-popup-wrapper").fadeIn().addClass('active');

        var id = parseInt($(this).attr("data-id"));
        $(".js-popup-item[data-id='"+id+"']").fadeIn().addClass('active');
    });

Но есть баг, когда открываю первый, открывает первый попап, закрываю, открываю второй попап, открывается второй попап, закрываю, тыкаю на первый, открывается второй попап.

Answer 1

[drtvader]

$(document).ready(function(){
    $('.js-open-popup').bind("click", function(){
        $(".js-popup-wrapper").fadeIn().addClass('active');
        $(this).parent().addClass("active");
        $(".js-popup-item[data-id='"+parseInt($(this).attr("data-id"))+"']").fadeIn().addClass('active');
    });

    $('.js-close-popup').bind("click", function(){
        $(".js-popup-wrapper").fadeOut().removeClass('active');
        $('.b-advantage__plus').removeClass('active');
        $(".js-popup-item").fadeOut().removeClass('active');
    });
});