javascript - Jquery Display Div with Interval -

i looking hide several divs 1 one or time interval of 5 seconds, tried below doesn't seem work though

<div id="container"> <div id="data1">123</div> <div id="data2">456</div> <div id="data3">789</div> <div id="data4">012</div> </div> <script>  $('document').ready(function(){      window.settimeout('mytimer()',5000);   }); $('document').ready(function(){      window.settimeout('mytimer2()',10000);   });  $('document').ready(function(){      window.settimeout('mytimer3()',15000);   });  $('document').ready(function(){      window.settimeout('mytimer4()',20000);   });     function mytimer(){   $('#data1').hide();    }    function mytimer2(){   $('#data2').hide();    }    function mytimer3(){   $('#data3').hide();    }    function mytimer4(){   $('#data4').hide();    }    </script> 

i use single timeout function hiding @ regular intervals. there 1 mistake in code need pass reference of function settimeout instead of passing function call string.

live demo

window.settimeout(mytimer,1000); index = 1; function mytimer() {           $('#data' + (index++)).hide();      if(index <= 4) window.settimeout(mytimer,1000); }