title: How to make JQuery continuously loop
body: <p>Can someone please assist with this please? I'm clearly a rookie as this isn't tough but I can't figure it out.  This rotates between 4 background images and all I want to do is have it start over at the first image (loop) and run through the function again.     </p>
  
  <p>Really appreciate the help! </p>
  
  <pre><code>$(document).ready(function(){ 
  
  
  $(".wrapper").css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-1.jpg') %&gt;)"
      );
      setTimeout(function(){
              $(".wrapper").css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-1.jpg') %&gt;)"
          ).fadeOut(function(){
              $(this).css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-2.jpg') %&gt;)"
              ).fadeIn();
          });
          setTimeout(function(){
                  $(".wrapper").css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-2.jpg') %&gt;)"
              ).fadeOut(function(){
                  $(this).css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-3.jpg') %&gt;)"
                  ).fadeIn();
              });
              setTimeout(function(){
                      $(".wrapper").css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-3.jpg') %&gt;)"
                  ).fadeOut(function(){
                      $(this).css("background-image", "linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(&lt;%= asset_path('bg-4.jpg') %&gt;)"
                      ).fadeIn();
                  });
              }, 3000);
          }, 3000);
      }, 3000);
  
  
  });
  </code></pre>