Sequential data loading

For http://stackoverflow.com/q/4158102/445073

HTML

<h1>Sequential Version</h1>
<p>Experiments for <a href="http://stackoverflow.com/q/4158102/445073">stackoverflow question</a> pulling <a href="https://github.com/daybarr/testdata/blob/master/ten-k-rows/demo.response.json">JSON data from github</a>.</p>
<p>
<ul>
    <li>Number of files (40-100): <input id="numfiles" type="number" max="100" min="40" value="50" /></li>
</ul>
<button id="go">Load!</button>
</p>
<div id="countdown"></div>
<div id="output"></div>

CSS

h1 {font-weight: bold;}
h1, p, div, ul {margin-bottom: 0.8ex;}

JavaScript

$(function() {
    var BookData = {},
        BookIndex = 'something';
    BookData[BookIndex] = [];
    
    $('#go').click(function() {
        $('#go').attr('disabled', true);
        var numFiles = parseInt($('#numfiles').val(), 10);
        var start = new Date().getTime();
        var loadFile = function() {
            $('#countdown').text(''+numFiles+' files remaining');
            if (numFiles) {
                numFiles -= 1;
                $.getJSON('/gh/get/response.json/daybarr/testdata/tree/master/ten-k-rows/', function(json) {
                    Array.prototype.push.apply(BookData[BookIndex], json);
                    setTimeout(function(){ loadFile(); }, 1000);
                });
            } else {
                var duration = new Date().getTime() - start;
                $('#output').text("Took " + duration + " ms to load " + BookData[BookIndex].length + " entries");
            };
        };
        loadFile();
    });
});