setInterval issues

//SLIDESHOW
var delay = 7500;
var index = 0;
var leftChevron = document.getElementById('left-chevron');
var rightChevron = document.getElementById('right-chevron');
var slideInterval = setInterval(nextSlide, delay);
var slides = [
  document.getElementById('slide0'),
  document.getElementById('slide1'),
  document.getElementById('slide2'),
  document.getElementById('slide3'),
  document.getElementById('slide4'),
  document.getElementById('slide5'),
  document.getElementById('slide6')
];

leftChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  slides[index].style.opacity = '0';
  index == 0 ? index = 6 : index--;  
  slides[index].style.opacity = '100';
  slideInterval = setInterval(nextSlide, delay);
});

rightChevron.addEventListener('click', function() {
  clearInterval(slideInterval);
  nextSlide();
  slideInteral = setInterval(nextSlide, delay);
});

function nextSlide() {
  slides[index].style.opacity = '0';
  index == 6 ? index = 0 : index++;   
  slides[index].style.opacity = '100';
};

its not clearing the interval on my clicks - when I make my click, it just speeds up the time between slides - I tried separating my clicks into mousedown and mouseup events - no luck. Any thoughts?

nevermind - typo - missing v