I made a stupid mistake and use a while loop instead of if. This caused the setTimeout to work, but the actual time pauses were not effected. The background went to immediately black instead of fading slowly. Since in my mind, the while and if did the same job, why did the while loop negate the time effect in setTimeout?
function fadeIt() {
var foo = document.getElementById("outer");
var color = new Array(11);
color[1] = "000000";
color[2] = "191919";
color[3] = "333333";
color[4] = "4D4D4D";
color[5] = "666666";
color[6] = "808080";
color[7] = "999999";
color[8] = "B2B2B2";
color[9] = "CCCCCC";
color[10] = "E6E6E6";
color[11] = "FFFFFF";
i = 11;
fadeOut();
function fadeOut () {
while ( i > 0 ) {
var background = foo.style.backgroundColor = "#" + color;
i -=1;
setTimeout(fadeOut, 1000);
}
}
}