Javascript 从setTimeout完成函数后调用函数

下面是函数fadeItem（），它将在加载DOM后1秒后运行，现在我想在fadeItem（）完成后调用另一个函数

HTML

<ul class="navigation ui-slider-tabs-list">
   <li style="" class="effect selected hide_selected"> <a id="" href="#company-profile">
      Company Profile                                                </a>
   </li>
   <li style="" class="effect"> <a id="" href="#sg-corporate-value">
      SG Corporate Value                                                </a>
   </li>
   <li style="" class="effect"> <a id="" href="#sg-corporate-philosophy">
      SG Corporate Philosophy                                                 </a>
   </li>
   <li style="" class="effect"> <a id="" href="#sg-critical-success-factors">
      SG Critical Success Factors                                                 </a>
   </li>
</ul>

问题是fadeItem（）和removeClass（）同时运行。我想先运行fadeItem（），然后再运行removeClass（）

因此，在fadeItem（）动画完成后，而不是在开始时，结果应该是公司简介的下划线链接

---

您可以检查my fiddle（我的小提琴）

在淡出回调函数后键入您想退出的内容，如下所示：

 function fadeItem() {
    $('ul.navigation li:hidden:first').delay(100).fadeIn(function(){
        $(this).removeClass('hide_selected');
        fadeItem();
    });
}

如果需要在类显示所有元素后删除该类，则：

 function fadeItem() {
    if($('ul.navigation li:hidden').length>0){
        $('ul.navigation li:hidden:first').delay(100).fadeIn(function(){
            fadeItem();
        });
    } else {
        $('.ui-slider-tabs-list li.selected').removeClass('hide_selected');
    }
}

---

将removeClass放在setTimeout中，正好在fadeItem（）之后

几乎正确，但在fadeItem（）完成后，我需要

删除类

，我的意思是在

SG关键成功因素

加载后。

 function fadeItem() {
    $('ul.navigation li:hidden:first').delay(100).fadeIn(function(){
        $(this).removeClass('hide_selected');
        fadeItem();
    });
}

 function fadeItem() {
    if($('ul.navigation li:hidden').length>0){
        $('ul.navigation li:hidden:first').delay(100).fadeIn(function(){
            fadeItem();
        });
    } else {
        $('.ui-slider-tabs-list li.selected').removeClass('hide_selected');
    }
}