Использование погодного API

Я хочу создать простую веб-страницу, которая притягивает результаты приливов от wunderground.com. Тем не менее, похоже, ничего не видно. Я вставил функцию load так, что что-то появляется, когда страница загружается, а затем работает оттуда (стилизация моего сайта), но ничего похожего на мой заголовок не появляется.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript"></script>
<h1>Tide High/Low</h1>
<section id="fetch">
  <div id="tweets"></div>

<style>
body {
  background: #00CCFF;
}

h1 { 
  font-size: 100px;
  font-weight: bold; 
  text-align: center;
  font-family: sans-serif;
  color: white;

}

#search {
  font-size: 15px;
  left: 200px;
  font-weight: bold; 
  font-family: sans-serif;
  color: #00CCFF;
  margin-left: 275px;

}
</style>

<script>
$("#tweets").load("http://api.wunderground.com/api/961d546ea36a6968/tide.json",
    function(responseTxt,statusTxt,xhr){
      if(statusTxt=="success")
          alert("External content loaded successfully!");
      if(statusTxt=="error")
          alert("wuddup: "+xhr.status+": "+xhr.statusText);
});

function getWeather(callback) {
  var weather = 'http://api.wunderground.com/api/961d546ea36a6968/tide.json';
  $.ajax({
    dataType: "jsonp",
    url: weather,
    success: callback
  });


getWeather(function (data) {
  console.log('weather data received');
  console.log(data.list[0].weather[0].description); 
  console.log(data.list[0].weather[0].main);  
});

</script>