javascript - クラス名を変更してオブジェクトを 1 つずつアニメーション化する

Question

$(document).ready(function () {
    $('.box1').addClass('animated').delay(50).queue(function () {
        $('.box2').addClass('animated').delay(50).queue(function () {
            $('.box3').addClass('animated').delay(50).queue(function () {
                $('.box4').addClass('animated').delay(50).queue(function () {
                    $('.box5').addClass('animated').delay(50).queue(function () {
                        $('.box6').addClass('animated').delay(50).queue(function () {

                        });
                    });
                });
            });
        });
    });
});

これを単純化する方法を知る必要があります(を使用するなど++i)。ページの読み込み時にこのアニメーションが必要です。

すべてのクラス ( .box1、...) へのアニメーションの型コードなし。