Как запустить slick слайдер?

Question

[sagaton]

есть шаблон компонента "список новостей"
в нем такой код

<div class="row">
  <div class="col-12">
  <div class="single-item">


  <? foreach ($arResult["ITEMS"] as $arItem) { ?>
    <?
    $this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
    $this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
    ?>
    <div class="slider single-item  " id="<?= $this->GetEditAreaId($arItem['ID']); ?>">
      <iframe width="100%" height="208" src="" data-src="https://www.youtube-nocookie.com/embed/<?= $arItem["PREVIEW_TEXT"] ?>" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
    </div>
  <?
  }
  ?>
  </div></div>

</div>

есть еще код в файле script.js который лежит в шаблоне.

$('.single-item').slick({
  infinite: true,
  dots: true,
  slidesToShow: 3,
  slidesToScroll: 1
});

Подскажите что нужно поправить чтобы он заработал?

Comments

[Антон]

<div class="single-item newclass">

$('.newclass').slick({
  infinite: true,
  dots: true,
  slidesToShow: 3,
  slidesToScroll: 1
});

[sagaton]

Антон,
тогда single-item вообще не нужен ?

[Антон]

sagaton, не знаю. В JS нужно указывать класс, в который входит содержимое того, что должно крутиться. А вы указали один и тот же класс до foreach и внутри него. Сделайте так, как написал, должно работать, если slick подключен для шаблона.