Question

I’m having some trouble using the Element.getElementsByTagName method.

With the following HTML:

<p id="test">
    <p></p>
    <p></p>
</p>​

And the following Javascript:

var a = document.getElementById('test');
var b = a.getElementsByTagName('p');
console.log(a);
console.log(b);​

a is set to the wrapping paragraph, but b is set to an empty NodeList (example: http://jsfiddle.net/xGjMN/).

I excpected b contain the two inner paragraph elements. Am I completely misunderstanding something here?

Answer 1

You cannot nest <p> tags.

Your nested <p id="test"><p></p><p></p></p> is rendered as:

<p id="test"></p>
<p></p>
<p></p>
<p></p> <!-- From </p> -->

Hence a.getElementsByTagName('p') is an empty collection.