move upLooping by setInterval

move up

by Akram kamal

HTML

<body>
    <div id="apple0">apple 0</div>
    <div id="apple1">apple 1</div>
    <div id="apple2">apple 2</div>
    <button id="time_up">time up</button>
</body>

CSS

#apple0 {
    position: absolute;
    top: 600px;
    left: 400px;
    font: 24px arial;
}
#apple1 {
    position: absolute;
    top: 600px;
    left: 400px;
    font: 24px arial;
}
#apple2 {
    position: absolute;
    top: 600px;
    left: 400px;
    font: 24px arial;
}

JavaScript

$(document).ready(function () {
    var children = ["apple0", "apple1", "apple2"];
    var m = 0;
    var interval;

    $("#time_up").click(function (i) {
        interval = setInterval(movenow, 3000);
        this.disabled = true;
    });

    function movenow() {
        $("#" + children[m]).animate({
            top: 30
        }, 200);
        m = m + 1;
        if (m > children.length) clearInterval(interval)
    }
});