Использование Jquery для загрузки одного HTML-файла, задержка, затем другой, цикл

Question

Я хотел бы показать один HTML-файл. Затем исчезнуть к другому. Вот мой код, и он работает, за исключением первого раза, он ждет переключения 10 секунд. Затем после переключения он ждет 5 секунд между переключателями. Я немного сбит с толку относительно того, как JQuery обрабатывает таймауты и ждет. Я хотел бы подождать 5 секунд на переключатель, начиная с первого.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
        $("#responsecontainer3").load("ad1.html");
  var refreshId = setInterval(function() {
     $("#responsecontainer3").fadeTo("slow").load('ad1.html?randval='+ Math.random());

setTimeout(function() 
  { 
     $("#responsecontainer3").fadeTo("slow").load('ad2.html?randval='+ Math.random());
  }, 5000); 

 }, 10000);


});
</script>
<div id="responsecontainer3">
</div>

Answer 1

<script>
 $(document).ready(function() {
        $("#responsecontainer3").load("ad2.html");

   var index = 1;
   var refreshId = setInterval(function() {
      $("#responsecontainer3").load('ad'+index+'.html');
      index = (index == 2)? 1 : index+1;
   }, 5000);
   $.ajaxSetup({ cache: false });
});
</script>

Answer 2

function loadFile(url) {
   $("#responsecontainer3").load(url, function() {
       var index = parseInt( url.replace('ad','').replace('.html','') );
       $("#responsecontainer3").fadeTo('slow', function() {
         setTimeout(function() {
             index++;
             loadFile('ad'+index+'.html');
         }, 5000)
       });
   });
}

loadFile('ad1.html');