JSFiddle - React, Tailwind, and code Playground

by alessandro_pezzato

HTML

<script src="//cdn.jsdelivr.net/jquery.jfeed/0.1/jquery.jfeed.js"></script>
<ul id="news-gazzetta"></ul>

CSS

#news-gazzetta {
    list-style: none;
    margin: 0;
    padding: 0;
}
#news-gazzetta li {
    margin: 0;
    padding: 0;
}
#news-gazzetta a {
    text-decoration: none;
    color: white;
    font-weight: bold;
}
#news-gazzetta li.odd {
    background: #0000ff;
}
#news-gazzetta li.even {
    background: #6666ff;
}

JavaScript

(function () {

    var createItem = function (item) {
        var $li = $('<li/>');
        var $a = $('<a/>', {
            href: item.link
        });
        $a.text(item.title);
        $li.append($a);
        return $li;
    };

    jQuery.getFeed({
        url: 'http://www.gazzetta.it/rss/basket.xml',
        success: function (feed) {
            console.log(feed);
            var $ul = $('#news-gazzetta');
            $.each(feed.items, function (index, item) {
                var $item = createItem(item);
                $ul.append($item);
                $item.addClass(index % 2 ? 'odd' : 'even');
            });
        }
    });

}())