Как сделать правильно,что бы кнопка показать еще подгружала по ID?

Question

[Владимир Юрков]

Ребят,подскажите плиз,уже голова кипит,не могу сделать,у меня на сайте есть кнопка Показать еще,она подгружает контент по id обертки,т.е я оборачиваю контент в блок с id и при клике на кнопку Показать еще подгружается блок,НО если я делаю дубль кнопки для других блоков с другими id ,то мне подгружается только первый блок,не пойму как сделать что бы подгрузка шла с любым айди,т.е
reviewNomer1,reviewNomer2 и т.д

вот пример блока и скрипта

<div class="reviewNone" id="reviewNomer1">
тут какой то контент
</div>

$(function() {
    var reviewNomer = 1;
    $('.reviewBtn').on('click', function() {
        console.log(reviewNomer);
        $('#reviewNomer' + reviewNomer).slideDown(800);
        reviewNomer++;
        if (reviewNomer == 6) $(this).slideUp(200);
    })
});

Answer 1

[Антон Шаманов]

добавь аттрибуты data-review-id="..." и проверяй по ним, текущий объект в событии доступе через this

Comments

[Владимир Юрков]

спасибо,попробую

Answer 2

[dimaaan_21]

Достаточно повесить обработчики события клика на кнопки, которые при срабатывании будут добавлять блоку-контенту некий класс 'active', к примеру.

$('.card__button').on('click', function() {
  $(this).parents('.card').find('.card__content-article').addClass('active');
})

При помощи метода parents мы выбираем нашу карточку-родитель, после чего при помощи метода find обращаемся к блоку с контентом и добавляем ему необходимый класс.

Для наглядности обратитесь к этому pen'у