Variable scope in javascript
<p>This is a simple question, but I can't work it out.</p>

<p>The specifics aren't important, but here's the gist. I have some code like this:</p>

<pre><code>var lat = 0;
var lon = 0;

if (navigator.geolocation) {    
    navigator.geolocation.getCurrentPosition(function(position) {
        lat = position.coords.latitude;
        lon = position.coords.longitude;
    });
}
</code></pre>

<p>What I think it's doing is:</p>

<ol>
<li>Set lat and lon to 0</li>
<li>If the browser has geolocation, overwrite those variables with real values</li>
</ol>

<p>However, at the end of that chunk, lat and lon are still 0. I've tried adding <code>var</code>s, passing lat and lon to the function etc but with no success...</p>

<p>How do I make this work?</p>
