html5 - Change image of an object -

i want make when run function changes image of objects in function , thought work

for(var = 0; < heads.length; i++){heads[i].src = ram_head;} 

with ram_head equaling string url when run code image not change @ when run function.

example of code: http://jsfiddle.net/themagicalcake/urva7

here's code that:

• creates array of image objects (heads)

• assigns same image url of image objects (rams_head)

• and when each image has loaded draws image canvas.

example code , demo: http://jsfiddle.net/m1erickson/5dxe7/

var ram_head="https://dl.dropboxusercontent.com/u/139992952/multple/ramdisegno.jpg";  var heads=[]; heads.push(new image()); heads.push(new image());  for(var i=0;i<heads.length;i++){      heads[i].onload=function(){         ctx.drawimage(this,this.x,10);     }      heads[i].x=i*100;      heads[i].src=ram_head;  }