Dynamically creating a DIV in IE

Hi everyone,

I am writing something in JS that involves dynamically creating DIVs. So this is basically how I do it:

Code:

var newDiv = document.body.appendChild (document.createElement (‘div’));
newDiv.setAttribute (‘id’, ‘someDiv’);
newDiv.setAttribute (‘className’, ‘someClass’);

Now the problem is when I set any of the event-firing attributes of this newly created DIV:

Code:

newDiv.setAttribute (‘onmouseover’, ‘alert (this.id)’);

which, when rolled-over, should bring up that good old message box saying ‘someDiv’. But it doesn’t, so I start thinking ok I’ve got something wrong somewhere so I do another of those good old things:

Code:

alert (document.body.innerHTML);

and reload to get the following message:

Code:

<DIV class=someClass id=someDiv onmouseover=”alert (this.id)”></DIV>

Does anyone have any idea of what is going on here? It’s totally OK if I just do a document.write (blah blah) to create the div, but I want this script to run on most browsers (argh, the web-designer’s dream!). Also, why does IE write the class=blah before the id=blah when I didn’t set those attributes in that order. More importantly, why doesn’t it include the quotes around the class=”blah” or id=”blah”? I tried to rectify this by doing:

Code:

newDiv.setAttribute (‘id’, ‘”someDiv”‘);
newDiv.setAttribute (‘className’, ‘”someClass”‘);

but still no use.

I know you are probably thinking I should be writing this message to Bill Gates, but I don’t think he uses JS anyway!?!

OK, thanks is advance, sorry for taking long (typical Australian way, gotta get everything sorted out in every teeny-weeny detail!)

Yanbu

Also in #JavaScript _↴