Problems with looping in jQuery
<p>Well, heres what I mean.</p>

<p><a href="http://elektrikhost.com/" rel="nofollow">Go to site</a>.</p>

<p>Where it says latest news, there are some problems.</p>

<p>What i'm trying to do is:</p>

<p>Load site, see the loading bar.(image is in the HTML) The loading bar goes away, theres one paragraph that fades in.</p>

<p>That is what this is for.</p>

<pre><code>// Hides the loading image and fadesin content
  var $latest = $(".latest") 
  $latest
    .hide(); // Hide Content
  setTimeout(function(){
    $('#loading')
      .hide();  
    $latest.fadeIn();
  }
  , 3000);
</code></pre>

<p>Now, what I also want to do is hide the paragraph, fadeIn another one, then the one after that. Then restart that and loop allover again.</p>

<p>That is what this is for:</p>

<pre><code>$latest
  .hide()
  .first()
  .show(); 

  refreshId = setInterval(function() {
  next = $(".latest:visible").next(); 
  if (next.length) { 
  $latest.hide();
  next.fadeIn(); 
  } else {
  $(".latest")
    .hide()
    .first()
    .fadeIn();
  }
  }, 3000 );
</code></pre>

<p>As you can see, the two scripts conflicts with eachother and the whole thing goes crazy(That and the image keeps appearing). Is there a way to fix it?</p>
