Testing for a class

Testing for a class

Hi everyone, 

So I'm currently using Basic jQuery Slider(http://www.basic-slider.com/) in a webpage(www.posturemedic.ca). What I'm trying to do is on hover the first slide would for stop for 90 secs and then continue with the slide animation. The rest of the slides would stop for only a few secs and then continue with the slide animation. I was able to stop on hover for 90 seconds by adding setTimeout and the custom function fun. setTimeout delays the animation for 90 seconds, and then runs the fun function, which includes the original animation code. 

However, now I included an if statement to distinguish between the first slide and the rest. And I can't get that to work:

  1.  if($('.first-one').length > 0){
  2.                      var time = setTimeout(fun, 90000);
  3.                     }else{
  4.                      var time = setTimeout(fun, 20);
  5.                     }
Code for banner:
  1. <div id="banner">
  2. <div id="inner-banner">
  3. <ul class="bjqs"> 
  4. <li><p><iframe width="560" height="277" src="https://www.youtube.com/embed/DFWOyYUQ6ds?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe></iframe></li>
  5.     <li class="first-one"><a href="index.php?content=exercise-program"><img src="images/banner/PM-Banners-1.jpg" width="758" height="273" alt="Improve your Posture, Improve Your Health. Click Here to find out why" /></a></li>
  6. <li><a href="index.php?content=menu&page=posture-tips"><img src="images/banner/PM-Banners-2.jpg"  width="758" height="273" alt="Improve  your Posture Today! Click here to learn how" /></a></li>
  7. <li><a href="index.php?content=size-guide"><img src="images/banner/PM-Banners-3.jpg"  width="758" height="273"  alt="Stretch, Strenghten and Stabilize. Click here for simple posture exercises that get results" /></a></li>
  8. <li><a href="index.php?content=testimonials"><img src="images/banner/PM-Banners-4.jpg"  width="758" height="273"  alt="All ages sizes and abilities. Click here to find one that is right for you" /></a></li>
  9. <li><a href="#"><img src="images/banner/PM-Banners-5.jpg"  width="758" height="273"  alt="Buy online or locally. click here to find a retailer" /></a></li>
  10. </ul>
  11. </div>
  12. </div>
Code for js:
  1. $wrapper.hover(function () {
  2.                 if (!state.paused) {
  3.                     clearInterval(state.interval);
  4.                     state.paused = true;
  5.                }
  6.             }, function () {
  7.                 if (state.paused) {
  8.                  var fun = function(){
  9.                      state.interval = setInterval(function () {
  10.                          go(vars.fwd, false);
  11.                      }, settings.animspeed);
  12.                      }
  13.                     if($('.first-one').length > 0){
  14.                      var time = setTimeout(fun, 90000);
  15.                     }else{
  16.                      var time = setTimeout(fun, 20);
  17.                     }
  18.                     state.paused = false;
  19.                 }
  20.             });

  21.         };
Any help would be much appreciated. 

Thank you,
Aleks