如何使用jQuery停止动画

我正在开发一个应用程序，其中导航在类更改期间生成一些动画效果，而我们没有使用任何css/jQuery动画

完整代码在jsFiddle这里给出

考虑一下橙色类中的白色字母和橙色在另一个类中是如何淡出的。有没有一些jquery/css方法可以用来处理这种情况？

<nav id="lastNavigation" class="d row clearfix">
<aside class="col-xs-11">
    <div class="col-xs-12 lessonNavigation lesson">
        <ul class="expandable">
            <li class=""><a href="#"><span>L1<b>: Recognize a digit represents 10 times the value</b></span></a>
            </li>
            <li class=""><a href="#"> <span>L2<b>: Recognize a digit represents 10 times the value</b></span></a>
            </li>
            <li class=""><a href="#"> <span>L3<b>: Recognize a digit represents 10 times the value</b></span></a>
            </li>
            <li class=""><a href="#"> <span>L4<b>: Recognize a digit represents 10 times the value</b></span></a>
            </li>
            <li class=""><a href="#"><span>L5<b>: Recognize a digit represents 10 times the value</b></span></a>
            </li>
        </ul>
    </div>
</aside>
</nav>

使用的jQuery在这里

$('.lessonNavigation li').attr('class', 'dn');
$('.lessonNavigation li:eq(0)').attr('class', 'expanded left');
$('.lessonNavigation li:eq(1)').attr('class', 'activeLesson');
$('.lessonNavigation li:eq(2)').attr('class', 'expanded right');
// ========== Right Arrow and Right Tile moves navigation ================== 
function slidingNavRight() {
$('.lessonNavigation .expanded.left').attr('class', 'dn');
$('.lessonNavigation .activeLesson ').attr('class', 'expanded left');
$('.lessonNavigation .expanded.right').attr('class', 'activeLesson');
$('.lessonNavigation .activeLesson + li ').attr('class', 'expanded right');
}
$('.lessonNavigation').on('click', '.icon-arrow-right, .expanded.right', function () {
if ($('li:last-child').hasClass('activeLesson')) {
    return false;
}
slidingNavRight.apply('.icon-arrow-right, .expanded.right');
});
// ========== Left Arrow and Left Tile moves navigation ==================  
function slidingNavLeft() {
$('.lessonNavigation .expanded.right').attr('class', 'dn');
$('.lessonNavigation .activeLesson ').attr('class', 'expanded right');
$('.lessonNavigation .expanded.left').attr('class', 'activeLesson');
$('.lessonNavigation .activeLesson').prev().attr('class', 'expanded left');
}
$('.lessonNavigation').on('click', '.icon-arrow-left, .expanded.left', function () {
if ($('li:first-child').hasClass('activeLesson')) {
    return false;
}
slidingNavLeft.apply('.icon-arrow-left, .expanded.left');
});