jquery - Sequential order of Javascript functions -

i'm having bit of problem javascript. have list of article titles which, when click title, corresponding article appears on right hand side (fixed @ top of page). have got these articles fade in/out using javascript. have function which, when scrolled down , click on article title, scrolls page top.

the problem have when page scrolls , article changes @ same time, animations on both become quite choppy, in safari. there way make page scroll top first, make article change?

i'm asking if there away make javascript functions happen 1 after other, rather @ same time?

heres javascript:

$(document).ready(function () {    $('.scrollup').click(function () {       $("body").animate({          scrolltop: 0       }, 'slow');       return false;    });    $('.articlelist ul li').click(function() {       var = $(this).index();       $('.fullarticle').fadeto(500,0);       $('#article' + (i+1)).fadeto(500,1);    }); }); 

any hugely appreciated!

thank you

i'm guessing want keep click functionality on article list , elements class scrollup have 2 animations.

$(document).ready(function () {      $('.articlelist ul li').click(function () {         var = $(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);     } });