Javascript callback and return value - asynchronous calls

Question

I'm having trouble reading the result of a callback outside of the callback. Can I get some advice please.

/***** ORIGINAL post: ****/

function loadImg() {
    var url = '/img/image01.jpg';
    setImgUrl(url, function (result, i) {
        if (result == true) {
            console.log(result);
        }
        else if (result == false) {
            console.log(result);
        }
    });
    console.log(result);  // result is not defined
    return result;        // I need to return result to be used elsewhere.
}

function setImgUrl(url, callback) {
    var img = new Image();
    img.src = url;
    img.onload = function () {
        $('#img01').attr('src', url);
        callback(true);
    };
    img.onerror = function () {
        callback(false);
    };
}

/***** UPDATE: Answered my question: revised code to show asynchronous call behavior ******/

var loadImgResult = false;

$('.panels').click(function () {
    loadImg();
    console.log('panels: ' + loadImgResult);
});

$('#ImgPrev').click(function () {
    console.log('prev: ' + loadImgResult);
});

$('#ImgNext').click(function () {
    console.log('next: ' + loadImgResult);
});

function loadImg() {
    var url = '/img/panel01/image01.jpg';
    setImgUrl(url, function (result, i) {
        if (result == true) {
            loadImgResult = result;
            console.log('callback: ' + loadImgResult);
        }
        else if (result == false) {
            loadImgResult = result;
            console.log('callback: ' + loadImgResult);
        }
    });
    console.log('loadImg: ' + loadImgResult);
}

function setImgUrl(url, callback) {
    var img = new Image();
    img.src = url;
    img.onload = function () {
        $('#img01').attr('src', url);
        callback(true);
    };
    img.onerror = function () {
        callback(false);
    };
}

After reading more about asynchronous call behavior, it occurred to me that what I wanted to happen was actually happening but I was looking for it at the wrong time. Thanks to the reference to the duplicate post, which although was not an answer, did help to point out what was happening. The callback was being called after the code for my console.log output so the value had not yet changed. I listed the output from console.log to help show asynchronous behavior. It's interesting to note that "loadImg:" happens before "callback:" although it occurs earlier in code and therefore it is called asynchronous code.

/* Order of console.log outputs demonstrating asynchronous calls */
    loadImg: false
    panels: undefined
    callback: true
/* After the code has run, clicking another button does show result */
    next: true
    prev: true