Edit in JSFiddle

var sites = {},
    stats = ["total_questions", "total_answers", "total_unanswered", "total_comments", "total_users", "total_votes", "total_badges"];

$.ajax({
    url: "http://stackauth.com/1.0/sites", //API route to get the list of sites: http://stackauth.com/1.0/help/method?method=sites
    dataType: "jsonp",                     //We're making a JSONP response for a cross-domain call
    jsonp: "jsonp",                        //Setting the jsonp callback to 'jsonp' since the API expects ?jsonp=method
    success: function(data) {              //Do something with the data when it's returned
        $.each(data.api_sites, function(d) {   //Loop though each of the sites in the SE network, d is the index in the loop
            sites[this.name] = this;           //Store the site in our sites object
            setTimeout($.proxy(function() {                //We're delaying 300ms between requests for the API trottle
                $.ajax({                                   //Begin call of the individual site's stats route
                    url: this.api_endpoint + "/1.0/stats", //The route of the site, e.g. http://api.stackoverflow.com/1.0/stats
                    dataType: "jsonp",                     //Again we're using a JSONP request
                    jsonp: "jsonp",                        //Again we're passing the ?jsonp=method parameter
                    context: this,                         //Maintain this so it refers to the current site
                    success: function(sdata) {             //Do something with the individual stats when returned
                        this.statistics = sdata.statistics[0];                         //Store stats for possible later use
                        $("#rowTemplate").tmpl(this).appendTo("#output tbody")         //Use the template to create the row
                          .hide().fadeIn();                                            //simple effect
                    },
                    complete: refresh                                                  //Update totals each time, more for effect
                });
            }, this), d*300);                                                          //The delay: index*300ms, to space them out
        });
    }
});

function refresh() {                                                                                 //Method to refresh the table
    $("#output tbody tr").sort(function(a, b) {                                                      //Sort the table rows
        return $.text([a.cells[1]]) > $.text([b.cells[1]]) ? 1 : -1;                                 //Perform sort by site name
    }).appendTo("#output tbody");                                                                    //Add rows back to <tbody>
    var totals = $("#output tfoot tr td"), total = {};                                               //Get cells, start total tracking
    $.each(sites, function() {                                                                       //Loop through each site
        for (var stat in this.statistics) {                                                          //Loop through each stat
            if (this.statistics.hasOwnProperty(stat) && typeof(this.statistics[stat]) == "number") { //If the stat's a number...
                total[stat] = (total[stat] || 0) + this.statistics[stat];                            //Add it to the total
            }
        }
    });
    for (var i = 1; i < stats.length; i++) {                                                         //Loop through the totals
        totals.eq(i).text(total[stats[i - 1]]);                                                      //Update the footer counts
    }
};