How do I generate table rows full of data with Javascript in this case?

Question

I'm trying to fill a playlist with track metadata from Soundcloud using Soundmanager 2 and sc-player . I'm not very experienced with Javascript, so this is proving to be a little tricky...

Here's the code to generate a list with the names of all the tracks in it:

scplayer.on("scplayer.init", function(e, track, sound) {
    var $pl = $("#playlist");
    $pl.empty();
    //
    var playlist = scplayer.playlist();
    for (var x = 0, l = playlist.length; x < l; x++){
        var $li = $("<li>", {"html": "Loading.."}).data('index', x).appendTo($pl);
        (function (x, $li) {
            //lookup the track info
            scplayer.track_info(x).done(function (track) {
                //console.log(track);
                $li.html(track.title);

            });
        })(x, $li);         
    }

    $("#playlist").find('li:first').addClass('active');
});

That's an excellent start, but I also want to add the following across each song in the playlist as table cells in a table row (think iTunes):

1. $li.html(track.title);
2. $li.html(track.duration);
3. $li.html(track.description);
4. $li.html(track.playback_count);
5. $li.html(track.favoritings_count);
6. $li.html(track.release_year);

These all work on their own, but I've just got no idea how to loop through the data and generate table rows of it...

Answer 1

I am still learning JavaScript as well, but I would look at creating a Array in the for loop, so that you can capture all the data while only iterating over the playlist once. Then you can using the .push() Method to add that Array into a nested Array. So you would end up with an Array of Arrays, each individual Array holding all the data for one particular song. Does that make sense?

I am not fast enough yet to code what I am thinking in JSFiddle, but I will come back once I've got it and post it here.