Javascript object property not accessible in callback function
<p>I have a html page with this javascript in the body section of the page</p>

<p><a href="https://jsfiddle.net/bhytbodL/4/" rel="nofollow">JSFiddle link</a> (I'm new to jsfiddle, couldn't get it to work, any help on this is appreciated to...)</p>

<p>The Firebug console shows me <code>0</code> in <code>request</code>, <code>undefined</code> in <code>onError</code> and <code>0</code> in <code>callback</code>. I have two questions, why can't i access <code>this.loadErrors</code> in <code>onError</code>, and how would I implement this error counter?</p>

<p>EDIT: the source code</p>

<pre><code>var loader = new Loader();
loader.request(callback);

function callback(){
    console.log("loader.loadErrors in callback: " + loader.loadErrors);
}

function Loader(){
    this.loadErrors = 0;

    this.request=function(callback){
        for (var i = 0; i &lt; 3; i++){
            console.log("this.loadErrors in request: " + this.loadErrors);
            $.ajax("example", {error: onError}).done(callback);
        }
    }

    function onError(){
        console.log("this.loadErrors in onError: " + this.loadErrors);
        // this.loadErrors++;
        callback();
    }
}
</code></pre>