Convert JSON Data to HTML. I'm trying to use a different API from the challenge

JavaScript
1

Could you please guide me on why I cannot see the result of the parsed data?

HTML:

<div id="data"></div>

JS:

$(function() { 
  localWeather();  
});

function localWeather(){
 
  if (navigator.geolocation) {
  
    navigator.geolocation.getCurrentPosition(function(position) {  
   
      var data = $("#data");
      var url = "https://fcc-weather-api.glitch.me/api/current?lat=" + position.coords.latitude + "&" + "lon=" + position.coords.longitude;
     
      $.getJSON(url, function(json) {
     
       var html = "";       
       json.forEach(function(val) {      
       var keys = Object.keys(val);      
       html += "<div>";      
       keys.forEach(function(key) {      
         html += "<strong>" + key + "</strong>: " + val[key] + "<br>";
         });
        html += "</div><br>";
      });
      
       data.html(html);
       //data.html(JSON.stringify(json));

      });
   
  });
} 
}
2

Since json is not an array, json.forEach will not work. If you are not sure what json is, then put a console.log(typeof json) on the first line of the $.getJSON callback function.

1 Like