Previous Slide 2 error message


#1



https://www.codecademy.com/courses/web-beginner-en-seyrq/0/9?content_from=make-an-interactive-website%3Ajquery-effects

I keep getting this error message even though my code is identical to the example code from the hint. Please help!!

"Oops, try again. Remember to fade out the current slide and remove the 'active-slide' class."


var main = function (){
    $('.dropdown-toggle').click(function(){
        $('.dropdown-menu').toggle();
    });
    
$('.arrow-next').click(function(){
    var currentSlide = $('.active-slide');
    var nextSlide = currentSlide.next();
    var currentDot = $('.active-dot');
    var nextDot = currentDot.next();
    
     if(nextSlide.length == 0){
      nextSLide = $('.slide').first();
      nextDot = $('.dot').first();
    }

    currentSlide.fadeOut(600).removeClass('active-slide');
    nextSlide.fadeIn(600).addClass('active-slide');
    
    
$('.arrow-prev').click(function(){
    var currentSlide = $('.active-slide');
    var prevSlide = currentSlide.prev();
    
    if(prevSLide.length == 0){
        prevSlide = $('.slide').last();
    }
    
    currentSlide.fadeOut(600).removeClass('active-slide');
    prevSlide.fadeIn(600).addClass('active-slide');
    

})    
   currentDot.removeClass('active-dot');
   nextDot.addClass('active-dot');

});
};

$(document).ready(main);


#2

Hi your code should have that structture

var main = function (){
    $('.dropdown-toggle').click(function(){
       ...
    });

    $('.arrow-next').click(function(){
       ...
    });
   
    $('.arrow-prev').click(function(){
       ...
    });
}
$(document).ready(main);

#3

My code already has this structure


#4

look well

var main = function (){
    $('.dropdown-toggle').click(function(){
        $('.dropdown-menu').toggle();
    });
    
$('.arrow-next').click(function(){
    var currentSlide = $('.active-slide');
    var nextSlide = currentSlide.next();
    var currentDot = $('.active-dot');
    var nextDot = currentDot.next();
    
     if(nextSlide.length == 0){
      nextSLide = $('.slide').first();
      nextDot = $('.dot').first();
    }

    currentSlide.fadeOut(600).removeClass('active-slide');
    nextSlide.fadeIn(600).addClass('active-slide');
    
    #here its missing the closing }); of the $('arrow-next').click...

$('.arrow-prev').click(function(){
    var currentSlide = $('.active-slide');
    var prevSlide = currentSlide.prev();
    
    if(prevSLide.length == 0){
        prevSlide = $('.slide').last();
    }
    
    currentSlide.fadeOut(600).removeClass('active-slide');
    prevSlide.fadeIn(600).addClass('active-slide');
    

}) #so you should remove this one })

   currentDot.removeClass('active-dot');
   nextDot.addClass('active-dot');

});
};

$(document).ready(main);

Read the comment