JQuery nextAll превалирует над каждой функцией без возврата

Question

Следующий код был разработан для применения процедуры ко всем дочерним элементам контейнеров до и после нажатия на один из них.Это сломано в некотором роде.Я никогда не использовал nextAll или prevAll, так что это, вероятно, связано с плохим кодированием.

$('.bounceholder ul').prevAll().each(function(){
            $(this + ' li').each(function(){
                $(this).animate({left: -200, top:-8, leaveTransforms:true}, 600);
            });
        });


        $('.bounceholder ul').nextAll().each(function(){
            $(this + ' li').each(function(){
                $(this).animate({left: +1000, top:-8, leaveTransforms:true}, 600);
            });
        });

В чем проблема

Answer 1

Попробуйте это:

    $('.bounceholder ul').prevAll().each(function() {
        $('li', this).animate({left: -200, top:-8, leaveTransforms:true}, 600);
    });


    $('.bounceholder ul').nextAll().each(function(){
        $('li', this).animate({left: +1000, top:-8, leaveTransforms:true}, 600);
    });

Answer 2

Хороший ответ уже был дан (используя this в качестве контекста, а не пытаясь объединить его со строкой li), но вы можете использовать siblings в качестве более короткой альтернативы:

$('.bounceholder ul').siblings().each(function() {
    $('li', this).animate({left: -200, top:-8, leaveTransforms:true}, 600);
});

Поскольку prevAll возвращает всех предшествующих братьев и сестер, а nextAll возвращает всех следующих братьев и сестер выбранного элемента, siblings должен обеспечивать точно такую ​​же функциональность, но требует только один блок кода.