Callback functions are used to run several lines of code containing effects that need to finish running individually before running the next line of code. Otherwise there is the risk of errors or effects conflicting with one another causing an undesired result.

$(selector).fadeOut(speed, easing, callback)

In the following, on a button click, we have the <div> element fading out, and then an alert that it has faded out. We use the callback function so that the message does NOT display until AFTER the effect has completed.

$('button').click(function() {
    $('div').fadeOut('slow', 'swing', function() {
        alert('The div is now hidden');
    });
});

If we did NOT use a callback function, and wrote the code as follows, the alert may show before the effect has finished. It would still be temporarily showing the element on the page, but the alert would say it was already hidden.

$('button').click(function() {
    $('div').fadeOut('slow', 'swing');
    alert('The div is now hidden');
});