Помогите исправить скрипт

[labirint]

  const $catalogDescr = $('.product-category-112 .catalog-descr');
  console.log($('.product-category-112 .catalog-descr > div').outerHeight());
  if ($('.product-category-112 .catalog-descr > div').outerHeight() > 500) {
    $catalogDescr.addClass('with-after');

    const $button = $('<button></button>').addClass('readMore');

    const lang = $('html').attr('lang');
    const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';

    $button.text(buttonText);

    $('.product-category-112 .catalog-descr > div').append($button);

    $button.on('click', function () {
      if ($catalogDescr.hasClass('with-after')) {
        $catalogDescr.removeClass('with-after');
        $button.text(lang === 'uk' ? 'Згорнути' : 'Скрыть');
      } else {
        $catalogDescr.addClass('with-after');
        const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';
        $button.text(buttonText);
      }
    });
  }

Скрипт для скрытия/раскрытия длинного текста для посадочных страниц фильтра. Но есть проблема, работает только для .product-category-112, а нужно еще например, для .product-category-74, .product-category-61 и т.д. Как в код добавить условие при котором скрипт будет работать для других вариантов ".product-category-"?

 

[sol_los]

удали в этом скрипте .product-category-112 - во всех местах

 

[labirint]

Блин, теперь скрывает текст где нужно и где не нужно

 

[sol_los]

по кофейной гуще гадать не умею. описания условий мало. html нет. то что вы просили - выполнено.

 

[labirint]

Мне казалось всё просто будет, что-то вроде - есть условие, которое нужно применить и к одному (.product-category-112) и к другому (.product-category-74)

 

[sol_los]

Мне казалось всё просто будет, что-то вроде - есть условие, которое нужно применить и к одному (.product-category-112) и к другому (.product-category-74)

т.е. ты хочешь каждый раз в скрипт пихать уникальные id категорий?

 

[labirint]

да, мне их нужно штук 5-6, максимум, для остальных категорий, в моём случае, смысла пока нету

 

[sol_los]

по идее так. чет у меня уже каша в башке с ванилью и jquery

//массив id
const ids = [
    '.product-category-112',
    '.product-category-114',
    '.product-category-115',
    '.product-category-116',
];


ids.forEach(id=>{

    const $catalogDescr = $(id+' .catalog-descr');

    if ($(id + '.catalog-descr > div').outerHeight() > 500) {
        $catalogDescr.addClass('with-after');
        const $button = $('<button></button>').addClass('readMore');
        const lang = $('html').attr('lang');
        const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';
        $button.text(buttonText);
        $(id +' .catalog-descr > div').append($button);

        $button.on('click', function () {
            if ($catalogDescr.hasClass('with-after')) {
                $catalogDescr.removeClass('with-after');
                $button.text(lang === 'uk' ? 'Згорнути' : 'Скрыть');
            } else {
                $catalogDescr.addClass('with-after');
                const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';
                $button.text(buttonText);
            }

        });

    }

})

 

[labirint]

Увы, так не заработал

 

[sol_los]

Увы, так не заработал

пробел потерялся. так должно работать

//массив id
const ids = [
    '.product-category-112',
    '.product-category-114',
    '.product-category-115',
    '.product-category-116',
];


ids.forEach(id=>{

    const $catalogDescr = $(id+' .catalog-descr');

    if ($(id + ' .catalog-descr > div').outerHeight() > 500) {
        $catalogDescr.addClass('with-after');
        const $button = $('<button></button>').addClass('readMore');
        const lang = $('html').attr('lang');
        const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';
        $button.text(buttonText);
        $(id +' .catalog-descr > div').append($button);

        $button.on('click', function () {
            if ($catalogDescr.hasClass('with-after')) {
                $catalogDescr.removeClass('with-after');
                $button.text(lang === 'uk' ? 'Згорнути' : 'Скрыть');
            } else {
                $catalogDescr.addClass('with-after');
                const buttonText = lang === 'uk' ? 'Читати далі' : 'Читать далее';
                $button.text(buttonText);
            }

        });

    }

})