Basic understanding of loops in jQuery -

i'm having hard time understanding how loop jquery, think problem think in php manner.

lets i've got simple example.

html:

<div style="background:#98bf21;height:100px;width:100px;position:relative"> 

js

$(document).ready(function(){ $("div").animate({height:300},"slow"); $("div").animate({width:300},"slow"); $("div").animate({height:100},"slow"); $("div").animate({width:100},"slow"); }); 

se here

if understood correctly, have use .each() *

but cant figure out how make work.

note: example, i'm interested more in approach take, rather actual looping.

thanks in advance, please ask if clarification needed!

*i'm not looking answer .each(), approach take fine learning purposes.

you need function can kick off last animation's callback, this:

$(function(){     function loop() {       $("div").animate({height:300},"slow")               .animate({width:300 },"slow")               .animate({height:100},"slow")               .animate({width:100 },"slow", loop);     }     loop(); }); 

you can test out here.