JSFiddle - React, Tailwind, and code Playground

by Andy Mcloughlin

HTML

<p id="output1"></p>
<p id="output2"></p>
<p id="output3"></p>

JavaScript

var theWeather = {
    "coord": {
        "lon": -33.890542,
            "lat": 151.274856
    },
        "sys": {
        "message": 0.1863,
            "country": "CA",
            "sunrise": 1392811747,
            "sunset": 1392850422
    },
        "weather": [{
        "id": 721,
            "main": "Haze",
            "description": "haze",
            "icon": "50d"
    }],
        "base": "cmc stations",
        "main": {
        "temp": 273.49,
            "humidity": 99,
            "temp_min": 271.15,
            "temp_max": 275.85,
            "pressure": 1017.42
    },
        "wind": {
        "speed": 3.11,
            "deg": 227.501
    },
        "clouds": {
        "all": 36
    },
        "dt": 1392826958,
        "id": 6167865,
        "name": "Toronto",
        "cod": 200
}; 

alert(theWeather.coord);

var coord = theWeather.coord;
alert(coord.lat + ", " + coord.lon);
function show_props(obj, objName) {
  var result = "";
    
  for (var prop in obj) {
    result += objName + "." + prop + " = " + obj[prop] + "\n";
  }
    
  return result;
}

for (var i=0; i < theWeather.length; i++){
console.log(theWeather);
}

theWeather.push("it is");
theWeather.push("cold");
for (i=0; i <= 2; i++){
$("#output2").text(theWeather.join(" "));
     }
$("#output1").text(show_props(theWeather[0].coord));
$("#output3").text(theWeather.coord);