Why does my event handler cause an "is not a function" error, but works from the Firebug console?
<p>Using JQuery 1.2.6, testing from Firefox 3 and IE7.  I have a very basic bit of JavaScript to reload a captcha image.  In my JS file, I have:</p>

<pre><code>var Captcha = {
    count: 0,

    Refresh: function(){
        // Concatenate "count" to force a URL change, which forces the browser to reload the image
        $('#Captcha').attr('src', 'Captcha.aspx?' + Captcha.count);
        Captcha.count++;
    }
}
</code></pre>

<p>My link looks as follows:</p>

<pre><code>&lt;a href="javascript:void(0);" id="ChangeCaptcha" onclick="Captcha.Refresh();"&gt;Try a different image&lt;/a&gt;
</code></pre>

<p>When I click on the link, I get a JavaScript error.  From the Firebug plugin for Firefox, it says "Captcha.Refresh" is not a function.  So, I go to my Firebug console in the same window, and type</p>

<pre><code>Captcha
</code></pre>

<p>And I get an "object" in the response line (as expected).  I then type</p>

<pre><code>Captcah.Refresh
</code></pre>

<p>And I get a function() in the response line (as expected).  I then type</p>

<pre><code>Captcha.Refresh()
</code></pre>

<p>And it executes the function, updates my captcha image, everything is dandy.  If I go back and try the link again, it still does not work.  If I type in Capcha.Refresh() into the console without ever hitting the link, it also works fine.  What on earth am I missing here?  Clearly the JS is getting loaded, but why doesn't that function call work?</p>
