jQuery click function, wait for it to complete before starting again?
<p>At the moment when I double/treble/etc click on the .next button the script is ran, I need it to queue after each other? How can I do this so that the function is completed before starting again?</p>

<p>HTML</p>

<pre><code>&lt;ul id="one" class="first selected"&gt;
   &lt;li class="pic_one"&gt;&lt;/li&gt;
   &lt;li class="pic_two"&gt;&lt;/li&gt;
   &lt;li class="pic_three"&gt;&lt;/li&gt;                       
&lt;/ul&gt;
&lt;ul id="two"&gt;
   &lt;li class="pic_one"&gt;&lt;/li&gt;
   &lt;li class="pic_two"&gt;&lt;/li&gt;
   &lt;li class="pic_three"&gt;&lt;/li&gt;                        
&lt;/ul&gt;
&lt;ul id="three" class="last"&gt;
   &lt;li class="pic_one"&gt;&lt;/li&gt;
   &lt;li class="pic_two"&gt;&lt;/li&gt;
   &lt;li class="pic_three"&gt;&lt;/li&gt;                        
&lt;/ul&gt;
</code></pre>

<p>jQuery</p>

<pre><code>$('.slider .next').click(function(){
   if($('.slider ul.selected').hasClass('last')){
      // leave blank
   } else {
      $('.slider ul.selected').hide('slide', { direction: "left" }, 1000);  
      $('.slider ul.selected').removeClass('selected');
      $('.slider ul').parent().next('ul').show('slide', { direction: "right" }, 1000).addClass('selected'); 
   }
});
</code></pre>
