jQuery/JS - Count elements within element
<p>In jQuery or JS I need to count the amount of DIV elements inside my parent DIV called <code>cont</code>? I've seen similar questions here on StackOverflow and have tried the following.</p>

<pre><code>&lt;div class="b-load" id="cont"&gt;
    &lt;div&gt;
    &lt;img src="page2.jpg" alt=""/&gt;
    &lt;/div&gt;
    &lt;div&gt;
    &lt;img src="page3.jpg" alt="" /&gt;
    &lt;/div&gt;
    &lt;div&gt;
    &lt;img src="page4.jpg" alt="" /&gt;
    &lt;/div&gt;
    &lt;div&gt;
    &lt;img src="page5.jpg" alt="" /&gt;
    &lt;/div&gt;
&lt;/div&gt;

function countPages() {
    var maindiv = document.getElementById('cont');
    var count = maindiv.getElementsByTagName('div').length;
    alert(count);
}
</code></pre>

<p>The child DIV's are dynamically produced, so I need to count them after the page has finished loading. The problem I have is the function I wrote counts 13 DIV's and in this example, there should only 4!! Any help gratefully received..</p>
