javascript - 間隔のラベル アニメーション

Question

jQueryを使用してカウンタークロックを作成しています。ここに私のコードがあります

function timer(element) {
    var interval = 1;
    var timer_day1 = 0;
    var timer_day2 = 0;
    var timer_hour1 = 0;
    var timer_hour2 = 0;
    var timer_min1 = 0;
    var timer_min2 = 0;
    var timer_sec1 = 0;
    var timer_sec2 = 0;
    var timer_day_text = 0;
    var timer_hour_text = 0;
    var timer_min_text = 0;
    var timer_sec_text = 0;
    var timer_text = 0;
    $('<div id="div_append_timer">').appendTo("#" + element);
    $('#div_append_timer').append('<label id="lbl_timer_hour2" class="timer_class"></label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label id="lbl_timer_hour1" class="timer_class"></label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label class="lbl_semi_class">:</label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label id="lbl_timer_min2" class="timer_class"></label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label id="lbl_timer_min1" class="timer_class"></label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label class="lbl_semi_class">:</label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label id="lbl_timer_sec2" class="timer_class"></label>');
    $('#div_append_timer').append('&nbsp;&nbsp;');
    $('#div_append_timer').append('<label id="lbl_timer_sec1" class="timer_class"></label>');

    setInterval(function () {
        timer_sec1 = timer_sec1 + interval;
        if (parseInt(timer_sec1) > 9) {
            timer_sec2 = parseInt(timer_sec2 + 1);
            timer_sec1 = 0;
        }
        if (parseInt(timer_sec2) > 5) {
            timer_min1 = parseInt(timer_min1) + 1;
            timer_sec2 = 0;
        }
        if (parseInt(timer_min1) > 9) {
            timer_min2 = parseInt(timer_min2) + 1;
            timer_min1 = 0;
        }
        if (parseInt(timer_min2) > 5) {
            timer_hour1 = parseInt(timer_hour1) + 1;
            timer_min2 = 0;
        }
        if (parseInt(timer_hour1) > 9) {
            timer_hour2 = parseInt(timer_hour2) + 1;
            timer_hour1 = 0;
        }
        if (parseInt(timer_hour2) > 5) {
            timer_day1 = parseInt(timer_day1) + 1;
            timer_hour2 = 0;
        }
        timer_text = timer_hour2 + timer_hour1 + ":" + timer_min2 + timer_min1 + ":" + timer_sec2 + timer_sec1;
        $('#lbl_timer_hour2').text(timer_hour2);
        $('#lbl_timer_hour1').text(timer_hour1);
        $('#lbl_timer_min2').text(timer_min2);
        $('#lbl_timer_min1').text(timer_min1);
        $('#lbl_timer_sec2').text(timer_sec2);
        $('#lbl_timer_sec1').text(timer_sec1);
    }, 1000);
}

値が変更されるたびに、クラス timer_class のラベルをアニメーション化したいと考えています。成功せずに .animate() 関数を試しました。ラベルを上からアニメーションさせたいのですが、どうすればいいですか。

ここにjsfiddleリンクがあります