Me pregunto por qué se llama a doStuff() sin hacer clic.
function pageReady() { var buttonBox = document.getElementById("buttonBox"); buttonBox.onclick = doStuff(); function doStuff() { buttonBox.style.background = "orange"; buttonBox.style.width = "600px"; buttonBox.innerHTML = "<h2>SURPRISE!!</h2>"; } }Estás invocando la función, deberías cambiar
buttonBox.onclick = doStuff()a
buttonBox.onclick = doStuff;Ahora está pasando la función al controlador sin invocarlo.