Why use next() to add and remove a class multiple times?

Question

I really want to know why it's important to use function(next) and next() in the following code. Without next() you can only remove the class .open-sidebar one time after you added it by clicking the .header__menu__button--profile.

I thought next() is used to select the following sibling of an element!

Why do I need it to remove the class .open-sidebarevery time I click on .sidebar__top__button--close?

$('.header').on('click','.header__menu__button--profile',function(){
    $('.sidebar').addClass('open-sidebar');
});

$('.sidebar').on('click','.sidebar__top__button--close',function() {

    if($('.sidebar').hasClass('open-sidebar'))
    {
        $('.sidebar').delay(300).queue(function(next){
            $('.sidebar').removeClass('open-sidebar');
            next();
            });         
    }

});

Welcome to asynchronous programming. Read up on how jQuery's [`queue`](http://api.jquery.com/queue/#queue2) and asynchronous programming in general works. — DCoder, Mar 10 '13 at 12:01
http://stackoverflow.com/questions/1058158/can-somebody-explain-jquery-queue-to-me — yunzen, Mar 10 '13 at 12:13

Alnitak · Answer 1 · 2013-03-10T12:12:23.397

In this case, next is the parameter that was passed by jQuery to the .queue callback, which is a reference to the next function in the animation queue.

It's nothing whatsoever to do with .next(), the function that selects the next sibling elements from a jQuery collection.

It's used within .queue because you have to tell jQuery to process the remaining animation queue once you've done whatever it is you need to do, i.e.:

.queue(function(next) {
    // do stuff
    ...
    next();
})

or you can use .dequeue instead:

.queue(function() {  // NB: no parameter
     // do stuff
     ...
     $(this).dequeue();
})

The latter is actually the older way of doing this - the next parameter was introduced in jQuery 1.4 and if using multiple queues avoids the need to repeat the queue name in both the .queue and .dequeue calls.

Why use next() to add and remove a class multiple times?

1 Answers1