problem with form and getElementsByTagName

[DeX]

I have a form on a page and I'm trying to cycle through all the div elements in a row and add all those elements again on a new row.

 

I've created a very simplified version stripped down and it still doesn't work. Here's my code:

 

Inside the HTML body tag, nothing else on the page:

<form>
<formitem>
<div></div>
</formitem>
</form>

 

Javascript function:

function addRow2(id, names)
{
if (!document.getElementsByTagName) return;
formBody = document.getElementsByTagName("form").item(0);
formElement = formBody.getElementsByTagName("formitem").item(0);


div1 = formElement.getElementsByTagName("div");


alert("div1 items: " + div1.length);
}

 

Okay, there is one more thing on the page....a button:

  <div class="column"><br /> <button onClick="addRow2(0, true);return false;">+</button></div>

 

The problem here is Chrome and Firefox (go figure) are returning a 1 to the user because they're picking up the <div> tag perfectly. Internet Explorer is returning 0 every time and I can't figure out why. Why is it not getting the <div> tag? Thanks!

[termidave]

Where did you get this "<formitem>" tag from?  Is it in your doctype?  My guess is that Internet Explorer recognizes it as a node if it's getting to the alert at the end, but like usual, it's failing silently because it can't handle a "<formitem>" tag.  If you replaced formitem with something standard, like a div, I bet it will work in IE which would confirm that IE can't handle the nonstandard tag.

[Adam]

Yeah, termidave's right. On msdn there's a list of tags that it applies to:

 

http://msdn.microsoft.com/en-us/library/ms536439%28VS.85%29.aspx