Javascript - rotacja divów z odświeżaniem zawartości

Witam. Stoję przed następującym problemem. Potrzebuję zrobić mechanizm, który będzie rotował 2 divy. Każdy z divów ma zawierać content zaciągany z innej strony. Mechanizm ma działać następująco. Na początku pokazywany jest 1 div z zawartością która zaciąga się ze strony xxx.pl/strona1. Wyświetla się on na parę sekund, a w tym czasie do diva drugiego ładowana jest zawartość strony xxx.pl/strona2. Po paru sekundach następuje zamiana i proces się powtarza. Kluczowe jest to, żeby za każdym razem kiedy jeden div jest widoczny, zawartość drugiego jest odświeżana (ponownie zaciągana). Taki jakby mechanizm rotowania newsów/bannerów. Mam coś takiego na chwilę obecną:

 

<script type="text/javascript">

	function rotator() {
			
		$('div#rotator div').css({opacity: 0.0});
		$('div#rotator div:first').css({opacity: 1.0});
		setInterval('rotate()',3000);
			
	}
		
	function rotate() {	
			
		var current = ($('div#rotator div.active') ? 
                                   $('div#rotator div.active') : $('div#rotator div:first'));
		
		var next = ((current.next().length) ? ((current.next().hasClass('active')) ? 
                               $('div#rotator div:first') :current.next()) :    $('div#rotator div:first'));	
			
		$.get('banner1.html', function(data) {
  			next.html(data);
		});
			
		next.css({opacity: 0.0}).addClass('active').animate({opacity: 1.0}, 1000);
		current.animate({opacity: 0.0}, 1000).removeClass();
		
	};
		
	$(document).ready(function() {		
		rotator();
	});

</script>

<style type="text/css">
	div#rotator div { position:absoluteł }
</style>
			
<div id="rotator">
   <div class="active">banner-1</div>
   <div>banner-2</div>
</div>

Niestety po pierwsze pojawia się błąd w związku z get'em

"Node cannot be inserted at the specified point in the hierarchy"

z którym nie wiem jak sobie poradzić.

A po drugie nie wiem jak to dokończyć, bo tutaj odświeżana jest zawartość tylko 1 boxa, a chciałbym żeby to rotowało na oba.

Bardzo dziękuję za każdą, nawet najmniejszą pomoc.

Najpierw lament i ostrzeżenia: strasznie nie wydajny kod. Każde wywołanie $(selektor) musi przeszukać DOM (chyba, że to jest samo id), więc najlepiej jak najrzadziej tego tego używać, np. " $(taki selektor) ? $(taki selektor) : $(inny selektor) " jest strasznym bytem, bo gdy się powiedzie warunek to jeszcze raz każesz przeglądarce szukać tych elementów. Poza tym robisz to co każde 3 sekundy. Lepiej zapamiętać te elementy na samym początku i później nie zaciągać jQuery do bezsensownego przeszukiwania drzewa DOM.

Poza tym możesz spamiętać też która z kolei jest rotacja (lub co najmniej parzystość), żeby łatwo było decydować, który blok chcesz pokazywać.
Moim zdaniem dobrym rozwiązaniem jest:

$(document).ready(function(){
  // szukamy tych elementów i je spamiętujemy
  var div1 = $(selektor1),
      div2 = $(selektor2),
      parity = true; // zmienna pamiętająca stan obliczeń

  // jakaś inicjalizacja tych divów
  ....

  // funkcja rotujaca
  function rotate() {
    if (parity) {
       div1.ukryj().napełnijDanymi();
       div2.pokaż();
    }
    else {
       div2.ukryj().napełnijDanymi();
       div1.pokaż();
    }
    parity = !parity;
    setTimeout(rotate, 3000);
  }

  setTimeout(rotate, 3000);
});