Confused with innerHTML

**hiyatran** · 10-15-2011, 02:19 PM

I trying to display a random number using innerHTML
Here's my code:

Code:

<html>
<head>
<script language="JavaScript">
var myArray = new Array("String1", "String2", "String3", "String4", "String5", "String6", "String7", "String8", "String9", "String10");

var num = Math.floor(myArray.length * Math.random());

document.writeln(myArray[num]);
//document.getElementById("myString").innerHTML = myArray[num];
</script>
</head>


<body>
<div id="myString"></div>
</body>
</html>

it works when I use document.writeln(myArray[num]); but does NOT work for document.getElementById("myString").innerHTML = myArray[num];

any ideas??
tks

**rdoyle720** · 10-17-2011, 09:30 AM

Your browser reads HTML from top to bottom, and runs any Javascript it finds as it goes. When it runs document.getElementById("myString"), myString doesn't exist yet, because it hasn't read that far down the page.

To fix it, either put the javascript at the end of your page (often recommended for performance), or wait for the page to be done loading. An easy way to do that is:

Code:

window.onload=function(){
    document.getElementById("myString").innerHTML = myArray[num];
};

Thread: Confused with innerHTML

Thread Tools

Display

Confused with innerHTML

Posting Permissions