[snovapavel]

Добрый день!

Есть слайдер, который перебирает, собственно, слайды:

<ul class="container">
  <li class="cell showing">Содержимое 1</li>
  <li class="cell">Содержимое 2</li>
  <li class="cell">Содержимое 3</li>
</ul>

  <br>
  <br>

<ul class="container">
  <li class="cell showing">Содержимое 1</li>
  <li class="cell">Содержимое 2</li>
  <li class="cell">Содержимое 3</li>
</ul>

С одним контейнером работает отлично, но, если добавить ещё один контейнер на страницу с другим содержимым, вместо того, чтобы листать содержимое этих двух контейнеров синхронно, он вначале пролистывает содержимое первого контейнера, а затем второго.

Как заставить их работать синхронно?

Сам код:

var slides = document.querySelectorAll('.container .cell');
var currentSlide = 0;
var slideInterval = setInterval(nextSlide,2000);

function nextSlide() {
    slides[currentSlide].className = 'cell';
    currentSlide = (currentSlide+1)%slides.length;
    slides[currentSlide].className = 'cell showing';
}

И можно ли избавиться от класса .showing?

Большое спасибо!