JSFiddle - React, Tailwind, and code Playground

by Donal Devine

HTML

ZIP:
<input type='text' id='ZIPCode' value='90210' />
<button id="GetStateButton">Get State</button>
<p></p>State:
<div id='divResult'></div>

JavaScript

var getStatebutton = document.getElementById('GetStateButton');

getStatebutton.onclick = function () {
    var zipCode = document.getElementById('ZIPCode');
    var zip = zipCode.value;
    if (!zip) return;
    var url = 'http://api.zippopotam.us/us/' + zip;
    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4) {
            var result = xhr.responseText;
            var zippo = JSON.parse(result);
            var resultDiv = document.getElementById('divResult');
            resultDiv.innerHTML = zippo.places[0].state;
        }
    };
    xhr.open('GET', url, true);
    xhr.send(null);
};