JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<div id="file"></div>
<div id="filesize"></div>
<div id="loadsize"></div>

JavaScript

$(document).ready(function(){

    $.ajax({
    
        url:"http://api.openweathermap.org/data/2.5/weather?q=London",
        
        xhr:function(){
            var xhr = new window.XMLHttpRequest();
             xhr.addEventListener("progress", function(evt) {
           if (!evt.lengthComputable) { 
               var percentComplete = evt.loaded / evt.total;
               $("#filesize").text(evt.total +" bytes");
               $("#loadsize").text(evt.loaded + " bytes");
               //Do something with download progress
           }
       }, false);
       return xhr;              
        },
        
        success:function(response){
        
            $("#file").text(response);
        
        }
    
    
    })

})