Цикл по нескольким источникам RSS и вывод в разных div?

Question

Я хочу просмотреть два (возможно, в будущем) RSS-канала и поместить их в разные контейнеры. Я начал со следующего вопроса: JQuery Fetch Несколько RSS-каналов.

Вот мой код

    var thehtml = '';

    $(function () {
    var urls = ['http://www.gosugamers.net/counterstrike/news/rss', 'http://www.hltv.org/news.rss.php'];
    for (var i = 0; i < urls.length; i++) {
        $.ajax({
            type: "GET",
            url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q=' + encodeURIComponent(urls[i]),
            dataType: 'json',
            error: function () {
                alert('Unable to load feed, Incorrect path or invalid feed');
            },
            success: function (xml) {
                values = xml.responseData.feed.entries;
                console.log(values);

                $.each(values, function(idx, value){

                    thehtml += '<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>';    
                  });

              $("#content_1").html(thehtml);

            }
        });
    }
});

Я загружаю два RSS-канала и в выводе консоли вижу два массива данных.

Щас пользуюсь $(#content_1).html(thehtml); вывести данные канала в виде HTML в контейнерный элемент div, #content_1,

То, что я хочу сделать, это поместить первый RSS-канал в #content_1 а второй в #content_2, Я пытался с помощью .slice(0,10) но не мог заставить это работать, и это не кажется лучшим способом.

Answer 1

Здесь интервал на месте. Контейнер будет пуст для отображения новых данных.

Обновление: результаты Ajax ориентированы на content_1 и content_2 с необязательным вторым методом.

$(function () {
function GetFeeds(){
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/2
var Content=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;}
*/

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

Если вы не понимаете ни один из приведенных выше исходных кодов, пожалуйста, оставьте комментарий ниже, и я добавлю все необходимые комментарии / заметки. Оценка показана путем маркировки ответов

Надеюсь, это поможет. Удачного кодирования!