the function, "queue", can it only be executed once?

Question

here's my code

$('.project, .list').click(function(){
    $( ".c3_home" ).addClass('c3_left2').delay(400).queue(function(){
    $(this).addClass('c3_right');
});
});
$('#back').click(function(){
    $('.c3_home').removeClass('c3_right c3_left2');
});

on the first two clicks, the classes are added and removed but on the third click, only the c3_left is added while c3_right is not being added.

Answer 1

You have to clear the queue:

$( ".c3_home" ).clearQueue().addClass('c3_left2').delay(400).queue(function(){
    $(this).addClass('c3_right');
});

You could try using finish(): (jq 1.9 >) {which is supposed to clear all elements in queue}

$( ".c3_home" ).finish().addClass('c3_left2').delay(400).queue(function(){
    $(this).addClass('c3_right');
});

As suggested by Kevin, try that too:

$( ".c3_home" ).addClass('c3_left2').delay(400).queue(function(next){
        $(this).addClass('c3_right');
        next();
    });