Loop Through Multiple Rss Sources And Outputting In Different Divs?

I want to loop through two (possibly more in the future) RSS-feeds and put them in different container divs. I started out with following this question: JQuery Fetch Multiple RSS f

Solution 1:

Here is the interval in place. The container content will empty to display the new data.

Update: Ajax results target content_1 and content_2 with optional second method.

$(function () {
functionGetFeeds(){
var urls = ['http://www.gosugamers.net/counterstrike/news/rss', 'http://www.hltv.org/news.rss.php'];
urls.forEach(function(Query){
$.ajax({
  type: "GET",
  url: 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q='+encodeURIComponent(Query),
  dataType: 'json',
  error: function () {
  alert('Unable to load feed, Incorrect path or invalid feed');
  },
  success: function(xml) {
//--Target ID's By content_1/2varContent=parseInt(urls.indexOf(Query))+1;
  	$("#content_"+Content).html('');  
    $.each(xml.responseData.feed.entries, function(idx, value){
    $("#content_"+Content).append('<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>');    
  });
//---------------//--Target ID's By Domain (Method Two)/*
  	$("#"+Query.split('.')[1]).html('');  
    $.each(xml.responseData.feed.entries, function(idx, value){
    $("#"+Query.split('.')[1]).append('<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>');    
  });
-----------------------------------*/
  }
});
});
}
//Call GetFeeds every 5 seconds.setInterval(GetFeeds,5000);
//Page is ready, get feeds.GetFeeds();
});

#content_1{float:left;width:40%;overflow:hidden;border:solid 2px blue;}
#content_2{float:right;width:40%;overflow:hidden;border:solid 2px yellow;}
/* Method Two Styles
#gosugamers{float:left;width:40%;overflow:hidden;border:solid 2px green;}
#hltv{float:right;width:40%;overflow:hidden;border:solid 2px red;}
*/

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script><divid="content_1"></div><divid="content_2"></div><!-- Method Two Elements
<div id="gosugamers"></div>
<div id="hltv"></div>
-->

If you don't understand any of the source code above please leave a comment below and I add any necessary comments/notes. Appreciation is shown by marking answers

I hope this helps. Happy coding!