Question

How do I get jQuery to fade out the $(“#recentTrack”), replace it’s contents, and then fade it in again? The current code fades it out and keeps it hidden, rather than fading it in again:

    setInterval(
    function ()
    {
            $.getJSON('cache/lastfmCache.json', function(data){
            var x = data.recenttracks.track[0].artist["#text"];
            var y = $("#recentTrack").html();
            if(x != y) {
                $("#recentTrack").fadeOut('slow').html(x).fadeIn('slow)';
             }      
        $.get('update.php');    
    });
    }, 15000);

Answer 1

Just change $("#recentTrack").fadeOut('slow').html(x).fadeIn('slow)';

into:

$("#recentTrack").fadeOut('slow', function(){
  $(this).html(x).fadeIn("slow");
});

This way you wait for the event to complete.