Cannot return a value from a function when using xhttp in javascript

Question

Here the returned value is undefined in variable b. Because I'm trying to return a nested function value I guess. How can I return the value of x from drive function here?

function drive() {
    let xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function(){

        if(this.readyState == 4 && this.status == 200){
            var x = JSON.parse(this.response);
            console.log(x);
            return x;
            // return 1;
        }
    }
    xhttp.open("GET","https://api.openweathermap.org/data/2.5/find?q=Chennai&appid=0d0a354784e8166b7b9fee6a3a29bcc2&units=metric");
    xhttp.send();

}

document.getElementById("clickme").addEventListener("click", function () {
    let b = drive();
    console.log(b);
})