why change DOM property in anonymous function not working?
<pre><code>&lt;html&gt;
    &lt;head&gt;
        &lt;title&gt;test&lt;/title&gt;
        &lt;script type="text/javascript"&gt;
            function start(){
                document.getElementById("first_div").onclick = function(){
                    document.getElementById("another_div").style.color = "red";                 
                };
            }
        &lt;/script&gt;   
    &lt;/head&gt;
    &lt;body onload="start()"&gt;
        &lt;div id="first_div"&gt;first&lt;/div&gt;
        &lt;div id="anoter_div"&gt;second&lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>when I click on the first_div, an error occurred:</p>

<pre><code>TypeError: Result of expression 'document.getElementById("another_div")' [null] is not an object.
</code></pre>

<p>Any idea why this is not working?</p>

<p>thank you.</p>
