Set weather icon based on the forecast, using "meteocons" font type (http://www.alessioatzeni.com/meteocons/)

weatherIcon.js

$.getJSON('http://api.wunderground.com/api/API_KEY/conditions/q/CITY_NAME.json', function(Weather) {
    var weatherInfo = Weather.current_observation;
    var weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="1">';
    if(weatherInfo.weather === 'Partly Cloudy') {
        weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="3">';
    }
    else if (weatherInfo.weather === 'Mostly Cloudy') {
      weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="5">';
    }
    else if (weatherInfo.weather === 'Rain') {
      weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="8">';
    }
    else if (weatherInfo.weather === 'Snow') {
      weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="#">';
    }
    else if (weatherInfo.weather === 'Thunderstorm') {
      weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon="6">';
    }
    else {
      weatherIcon = '<span id="weatherIcon" class="meteoIcon" data-icon=")">';
    }
    document.getElementById('weatherIcon').innerHTML = weatherIcon;
});