JavaScript JQuery setTimeout
<p>I'm a beginner in JavaScript and JQuery and I was trying to exercise something</p>

<pre><code>var activetab = 0;

$("li").click(function () {
  $("#tabs-"+activetab).hide("slide", { direction: "left" }, 1000);
   $("li").eq(activetab).css('background-color','white');
  var index = $("li").index(this);
  $("span").text(index);
  $("li").eq(index).css('background-color','red');
    $("#tabs-"+index).show("slide", { direction: "left" }, 1000); 
  activetab = index;
});
</code></pre>

<p>Here is my fiddle:</p>

<p><a href="http://jsfiddle.net/6WC4J/" rel="nofollow">http://jsfiddle.net/6WC4J/</a></p>

<p>The problem is I'd like the show method to fire up after some time such that when the previous element will be hidden then the new one will show up,
tried using setTimeout but didn't work, any ideas?</p>

<p>Thanks Overall</p>
