hi guys, this always trips me up.

i'm running out of memmory at line 23, or the function
executes only once, (even if i call it several times), so
there isprobably a bug in the function causing the script
to halt.

javascript was the first language i learned years back,
and i've been coding php mostly since, so i might have
the wrong syntax.

all i'm trying to do is call goLeft(), and have it call itself
several times using setTimeOut() until the variable left is
no longer less than 50. which should animate the box
by moving it to the right 5px every 500milliseconds.

it's probably a very simple fix but i just can't recall.

help me out please.

lol, i know i can use jquery animate, but i'm doing a
live javascript course and learning to manually manipulate
the dom without using jquery.

it worked fine before encapsulating the code into a function
and just using setInterval(), so i dunno what went wrong.

thanks

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Accessing-Dom-Nodes</title>
<link rel="stylesheet" type="text/css" href="style.css">

</head>
<body>
	<div id="wrapper600">
		<h1>DOM Scripting - Javascript and CSS not jQuery</h1>
		<div id="leftPos">0</div>
		<div id="box" style="position:relative;border:1px dashed orange;width:50px;height:50px;"></div>
	</div>	
<script type="text/javascript">
var leftPos = document.getElementById("leftPos");
var box = document.getElementById("box");

function goLeft(){
left = 0;
	if( left < 50 ){
	left += 5;
	leftPos.innerHTML=left;
	box.style.left=left+'px';
	setTimeOut(goLeft(),500);
	}
}
goLeft();
</script>	
</body>
</html>