getElementsByTagName within an element javascript

Question

Why does the following return 0?

 <p id="g">
 <div>kk</div>
 <div>ee</div>
 <div>jff</div>
 </p>


  <script type="text/javascript">
  var ii = document.getElementById("g");
  var hh = ii.getElementsByTagName('div');
  document.write(hh.length);
  </script>

Answer 1

Because you can't have a <div> in a <p>. Paragraphs can only have inline elements as children.

As soon as the parser encounters a <div>, it auto-closes the <p>.

Compare

<p id="g">
  <span>kk</span>
  <div>ee</div>
  <div>jff</div>
</p>

<script type="text/javascript">
  var ii = document.getElementById("g");
  var hh = ii.getElementsByTagName('span');
  alert(hh.length);
</script>​