Next Dot 2 Flipboard 7

#1

<PLEASE USE THE FOLLOWING TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>
https://www.codecademy.com/courses/web-beginner-en-seyrq/0/7?content_from=make-an-interactive-website%3Ajquery-effects#

<In what way does your code behave incorrectly? Include ALL error messages.>
I am unable to get my dot to wrap around back to the first dot. I am sure it is a syntax issue but I cannot see where I am making the mistake

```

var main = function() {
('.dropdown-toggle').click(function() { (’.dropdown-menu’).toggle();
});
('.arrow-next').click(function(event) { var currentSlide = (’.active-slide’);
var nextSlide = currentSlide.next();
var currentDot = $(’.active-dot’);
nextDot = currentDot.next();
currentDot.removeClass(‘active-dot’);
nextDot.addClass(‘active-dot’);

           if (nextSlide.length == 0) {
       nextSlide = $('.slide').first();
       nextDot = $('.dot').first();
    }
    
   
    
    currentSlide.fadeOut(600).removeClass('active-slide');
    nextSlide.fadeIn(600).addClass('active-slide');
    });

};

$(document).ready(main);

<do not remove the three backticks above>
#2

I have tried it with the if statement before and after the variable declaration both yield the same results

#3

Hi
I see two things that are incorrect :

  1. you forgot to put a var in front of nextDot = currentDot.next();

  2. the two lines

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

should be written after the if (nextSlide.length == 0). Indeed, in the current state of the code, you change the class of the current/next dots without checking if it is the last one.