Not able to fetch info from weatherbit

<!DOCTYPE html>
<html>

<head>
    <title></title>


</head>

<body>
    <p id="Output"> Default Text</p>
    <input id="city">
    <button onclick="show_temp()">Submit</button>

    <script type="text/javascript">
       function show_temp() {

    document.getElementById("Output").style.color = "red";
    document.getElementById("Output").style.fontSize = "20px";

    city = document.getElementById("city").value;

    httprequest = new XMLHttpRequest();
    url = "https://api.weatherbit.io/v2.0/current?city=" + city + "&key=7044b8b9e3ac402f868b5f3861b15a7b&include=minutely";
    httpRequest.open("GET", url);
    httpRequest.send();

    httpRequest.onreadystatechange = function() {

        if (this.readyState == 4 && this.status == 200) {
            user_data = JSON.parse(this.responseText);
            document.getElementById("Output").innerHTML = user_data.data[0].temp;
        }
    }
}

    </script>
</body>

</html>

This is my code, API key is correct but still, it won’t fetch the value of temp

Default Text

Submit
<script type="text/javascript">
   function show_temp() {

document.getElementById("Output").style.color = "red";
document.getElementById("Output").style.fontSize = "20px";

city = document.getElementById("city").value;

httprequest = new XMLHttpRequest();
url = "https://api.weatherbit.io/v2.0/current?city=" + city + "&key=7044b8b9e3ac402f868b5f3861b15a7b&include=minutely";
httpRequest.open("GET", url);
httpRequest.send();

httpRequest.onreadystatechange = function() {

    if (this.readyState == 4 && this.status == 200) {
        user_data = JSON.parse(this.responseText);
        document.getElementById("Output").innerHTML = user_data.data[0].temp;
    }
}

}

</script>

My whole code

Hi @sr7752,

There is a typo in your code.

You have declared

  httprequest = new XMLHttpRequest();

but you are using httpRequest in other places. Here is your correct code -

<!DOCTYPE html>
<html>

<head>
    <title></title>


</head>

<body>
    <p id="Output"> Default Text</p>
    <input id="city">
    <button onclick="show_temp()">Submit</button>

    <script type="text/javascript">
       function show_temp() {

    document.getElementById("Output").style.color = "red";
    document.getElementById("Output").style.fontSize = "20px";

    city = document.getElementById("city").value;

    httprequest = new XMLHttpRequest();
    url = "https://api.weatherbit.io/v2.0/current?city=" + city + "&key=7044b8b9e3ac402f868b5f3861b15a7b&include=minutely";
    httprequest.open("GET", url);
    httprequest.send();

    httprequest.onreadystatechange = function() {

        if (this.readyState == 4 && this.status == 200) {
            user_data = JSON.parse(this.responseText);
            document.getElementById("Output").innerHTML = user_data.data[0].temp;
        }
    }
}

    </script>
</body>

</html

Do let me know in case you need any other information.