Inside a jQuery event handler, I would like to scroll the window and then add a class to something. This is my code:

$('#foo').click(function() {       
    window.scrollTo(y);
    $('#bar').addClass('active');
});
$(window).scroll(function() {
    $('#bar').removeClass('active');
});

Notice I have another handler to remove that same class whenever the window is scrolled. The scrolling part works fine, but seems to run asynchronously, so removeClass() happens after addClass() but before the scrolling is finished. I don't know how to do this in plain javascript. I know there is a jQuery scrollTop() function that does the same thing (but seems to have cross-browser issues), but it doesn't accept a callback.

What I really need is a callback to add the class after the scrolling is finished. thanks!