Map/Update Map function

index.html

<div id='map'></div>
<ul class='layers'>
    <li><a class='active' data-layer='mapbox.mapbox-graphite' href='#'>Mapbox Graphite</a></li>
</ul>

script.js

var map, legend, interaction;
var tileUrl = function(layer) {
    return 'http://api.tiles.mapbox.com/v3/' + layer + '.jsonp';
};

var buildMap = function(layer) {
    wax.tilejson(tileUrl(layer), function(tilejson) {
        layer = new wax.mm.connector(tilejson);
        map = new MM.Map('map', new wax.mm.connector(tilejson));
        wax.mm.bwdetect(map);
        interaction = wax.mm.interaction()
            .map(map)
            .tilejson(tilejson)
            .on(wax.tooltip().animate(true).parent(map.parent).events());
        legend = wax.mm.legend(map, tilejson).appendTo(map.parent);
    });
};

var updateMap = function(dataLayer) {
    wax.tilejson(tileUrl(dataLayer), function(t) {
        map.setLayerAt(0, new wax.mm.connector(t));
        interaction.tilejson(t);
        legend.content(t);
    });
};


// Somewhere after $(function() {
buildMap('mapbox.mapbox-streets');

$('ul.layers li a').click(function(e) {
    $('.wax-tooltip').remove();
    updateMap($(this).attr('data-layer'));
    return false;
});