Последовательный порядок функций Javascript

Я предполагаю, что вы хотите сохранить функциональность кликов в своем списке статей, и только элементы с прокруткой класса имеют 2 анимации.

$(document).ready(function () {

    $('.articlelist ul li').click(function () {
        var i = $(this).index();
        if ($(this).is(".scrollup")) {
            $("body").animate({
                scrollTop: 0
            }, 'slow', function () {//when animation completes
                fadeArticle(i);
            });
        } else {
            fadeArticle(i);
        }

    });

    function fadeArticle(i) {
        $('.fullarticle').fadeTo(500, 0);
        $('#article' + (i + 1)).fadeTo(500, 1);
    }
});

В вашем вызове animate() вы хотите добавить функцию, которая будет вызываться после завершения. Функция анимации, предоставляемая JQuery, принимает функцию как необязательный параметр. Когда анимация завершает эту функцию.

Вы можете использовать что-то вроде этого:

$('.scrollup').click(function () {
    $("body").animate({
        scrollTop: 0
    }, 'slow', showArticle);
    return false;
});

showArticle будет вызовом функции, которая затухает в статье, как анонимный, в вашем прослушивателе кликов. Вам, вероятно, потребуется какой-то способ передать аргумент о том, какую статью следует показывать.

Я относительно новичок в этом, но думаю, что это может сработать. То, что я пытаюсь сделать, заключает в себе каждую из них как вызываемую функцию, а затем передает одну функцию в качестве обратного вызова другому.

$(document).ready(function () {
scrollTop(showArticle());
});


function scrollTop(callback) {
    $('.scrollup').click(function () {
        $("body").animate({
            scrollTop: 0
        }, 'slow');
        callback;
    });
}

function showArticle() {
    $('.articlelist ul li').click(function () {
        var i = $(this).index();
        $('.fullarticle').fadeTo(500, 0);
        $('#article' + (i + 1)).fadeTo(500, 1);
    });
}