title: Can't get json object
body: <p>I am trying to get city name from input element and then get the weather information and also timezone information of the city from API. 
  However i can't get the json object in that function but it works outside the function.
  Can anyone help me?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var d = "Lisbon";
  $(document).ready(function() {
    $("#button").click(function() {
      d = document.getElementById("input").value;
      $(document).ready(function myfunction() {
        $.getJSON('http://api.openweathermap.org/data/2.5/weather?APPID=11d324c05e02e308c1c9eb8d8041b143&amp;q=' + d + '&amp;units=metric', function(data) {
          document.getElementById("city").innerHTML = data.name + ", " + data.sys.country;
          document.getElementById("wind").innerHTML = data.wind.speed + " m/s  ";
          document.getElementById("cloudiness").innerHTML = data.weather[0].description;
          document.getElementById("pressure").innerHTML = data.main.pressure + " hpa";
          document.getElementById("humidity").innerHTML = data.main.humidity + " %";
          document.getElementById("coord").innerHTML = "[ " + data.coord.lat + ", " + data.coord.lon + " ]";
          document.getElementById("temperature").innerHTML = data.main.temp + "°C";
          document.getElementById("icon").innerHTML = "&lt;img src=http://openweathermap.org/img/w/" + data.weather[0].icon + ".png" + "&gt;";
          console.log(data);
          (function() {
            $.getJSON("http://api.geonames.org/timezoneJSON?" + "lat=" + data.coord.lat + "&amp;" + "lng=" + data.coord.lon + "&amp;username=hrrs", function(data) {
              document.getElementById("time").innerHTML = data.time;
              document.getElementById("timeCity").innerHTML = data.timezoneId;
              document.getElementById("country").innerHTML = data.countryName;
              document.getElementById("sunrise").innerHTML = data.sunrise;
              document.getElementById("sunset").innerHTML = data.sunset;
              console.log(data);
            });
          })();
        });
        document.getElementById("slayt").innerHTML = '&lt;iframe src="http://www.panoramio.com/wapi/template/slideshow.html?tag=' + d + '&amp;amp;width=1920&amp;amp;height=500&amp;amp;" frameborder="0" width="1920" height="500" scrolling="no" marginwidth="0" marginheight="0"&gt;&lt;/iframe&gt;';
  
      })();
    });
  });</code></pre>
  </div>
  </div>
  </p>