Reputation: 167
I'm parseing the rss feed and displaying it but it is showing only one record.I'm using the following javascript . Please let me know how can I show all records in one div?
<script type="text/javascript">
$(document).ready(function () {
$.get("http://www.footballfriendsonline.com/blogs/rss.xml", function (data) {
$(data).find('item').each(function(i){
var title = $(this).find('title').text();
var container=$(this).find('description').text();
var img_url = $('img',container).attr('src');
var url=$(this).find('link').text();
var result='<li><a href="'+url+'" target="_blank"><span>'+title+'</span><span><img src="'+img_url+'" width="154" height="115"></span></li>';
$("#new_widget").html(result);
});
});
});
</script>
<div id="new_widget"></div>
Upvotes: 0
Views: 118
Reputation: 28124
There are two issues with your script. First, each loop result is overwriting the previous one. Second you are attaching li elements to a div, while you should attach them to an ol or ul element.
For example:
<script type="text/javascript">
var result="";
$(document).ready(function () {
$.get("http://www.footballfriendsonline.com/blogs/rss.xml", function (data) {
$(data).find('item').each(function(i){
...
result+='<li><a href="'+url+'" target="_blank"><span>'+title+'</span><span><img src="'+img_url+'" width="154" height="115"></span></li>';
});
$("#new_widget").html(result);
});
});
</script>
<ul id="new_widget"></ul>
Upvotes: 0
Reputation: 55740
You seem to be overwriting your html by calling this inside the $.each loop... You need to call this outside the loop..
$("#new_widget").html(result);
Try this piece of code
$(document).ready(function() {
$.get("http://www.footballfriendsonline.com/blogs/rss.xml", function(data) {
var result = '';
$(data).find('item').each(function(i) {
var title = $(this).find('title').text();
var container = $(this).find('description').text();
var img_url = $('img', container).attr('src');
var url = $(this).find('link').text();
result += '<li><a href="' + url + '" target="_blank"><span>' + title + '</span><span><img src="' + img_url + '" width="154" height="115"></span></li>';
});
$("#new_widget").html(result);
});
});
Upvotes: 0
Reputation: 7663
use append
instead of html
html
clear the previous html of div that's why you will get last feed
like this
$("#new_widget").append(result);
instead of
$("#new_widget").html(result);
Upvotes: 1