Не работает slick слайдер после того, как отображаю слайды с помощью JS с подгрузкой json данных?

const productsContainer = document.querySelector('#store__body')

getProducts()

async function getProducts() {
  const response = await fetch('./js/products.json')
  const productsArray = await response.json()
  renderProducts(productsArray)
}

function renderProducts(productsArray) {
  productsArray.forEach(function (item) {
    const productHTML = `<div class="store__inner">
    <div class="slider__body">
      <div class="slider">
        <div class="slider__item">
          <img
            data-fancybox="gallery"
            src="img/image_01.jpeg"
            alt=""
          />
        </div>
        <div class="slider__item">
          <img
            data-fancybox="gallery"
            src="img/image_02.jpeg"
            alt=""
          />
        </div>
        <div class="slider__item">
          <img
            data-fancybox="gallery"
            src="img/image_03.jpeg"
            alt=""
          />
        </div>
      </div>
      <div class="slick__thumbs">
        <div class="slider-th__item">
          <img src="img/image_01.jpeg" alt="" />
        </div>
        <div class="slider-th__item">
          <img src="img/image_02.jpeg" alt="" />
        </div>
        <div class="slider-th__item">
          <img src="img/image_03.jpeg" alt="" />
        </div>
      </div>
    </div>

    <div class="store__info">
      <div class="store__title">Жилет</div>
      <div class="store__text">
        <ul>
          <li>${item.desc}</li>
          <li>Рост модели 178 см</li>
          <li>Размер жилета M</li>
          <li>Вещь требует особого ухода</li>
        </ul>
      </div>
    </div>
  </div>`
    productsContainer.insertAdjacentHTML('beforeend', productHTML)
  })
}

// slick

$('.slider__body').each(function () {
  $('.slider', $(this)).slick({
    slidesToShow: 1,
    slidesToScroll: 1,
    fade: true,
    speed: 500,
    asNavFor: $(this).find('.slick__thumbs')
  })
  $('.slick__thumbs', $(this)).slick({
    slidesToShow: 3,
    slidesToScroll: 1,
    focusOnSelect: true,
    autoplay: false,
    vertical: true,
    asNavFor: $(this).find('.slider'),
    responsive: [
      {
        breakpoint: 640,
        settings: {
          vertical: false
        }
      }
    ]
  })
})

$(document).ready(function() {
  $('.collection__list').slick({
    slidesToShow: 2,
    slidesToScroll: 1,
    speed: 500,
    dots: true
  })
})

Fancybox.bind('[data-fancybox]', {})

<div class="store__body" id="store__body">
            <div class="store__inner">
              <div class="slider__body">
                <div class="slider">
                  <div class="slider__item">
                    <img
                      data-fancybox="gallery"
                      src="img/image_01.jpeg"
                      alt=""
                    />
                  </div>
                  <div class="slider__item">
                    <img
                      data-fancybox="gallery"
                      src="img/image_02.jpeg"
                      alt=""
                    />
                  </div>
                  <div class="slider__item">
                    <img
                      data-fancybox="gallery"
                      src="img/image_03.jpeg"
                      alt=""
                    />
                  </div>
                </div>
                <div class="slick__thumbs">
                  <div class="slider-th__item">
                    <img src="img/image_01.jpeg" alt="" />
                  </div>
                  <div class="slider-th__item">
                    <img src="img/image_02.jpeg" alt="" />
                  </div>
                  <div class="slider-th__item">
                    <img src="img/image_03.jpeg" alt="" />
                  </div>
                </div>
              </div>

              <div class="store__info">
                <div class="store__title">Жилет</div>
                <div class="store__btn"></div>
                <div class="store__text">
                  <ul>
                    <li>100% хлопок</li>
                    <li>Рост модели 178 см</li>
                    <li>Размер жилета M</li>
                    <li>Вещь требует особого ухода</li>
                  </ul>
                </div>
              </div>
            </div>