Javascript and the DOM 13/16 next(); function help

function main() {
('.skillset').hide(); (’.skillset’).fadeIn(1000);

$(’.projects’).hide();

('.projects-button').on('click', function() { (this).next().slideToggle(400);
(this).toggleClass('active'); (this).text(‘Projects Viewed’);
});
}

$(document).ready(main);

// I completed the Javascript course but I seem to have trouble visualizing and understanding how the next(); function works. "next(); helps us select elements that are next to another element. On the webpage after it is used, only the “Recent Projects” button of that section toggles the project list. I might be thinking about it wrong but how does adding next(); result in that specific section only being toggled?

the element with the class “projects-button” will execute:

slideToggle() to the NEXT element (might be a paragraph, an image or anything else that is next to the “projects-button”)