Radio switch attempt by wboykinm

index.html

<!DOCTYPE html>
<html>
<head>
  <script src='//api.tiles.mapbox.com/mapbox.js/v0.6.5/mapbox.js'></script>
  <link href='//api.tiles.mapbox.com/mapbox.js/v0.6.5/mapbox.css' rel='stylesheet' />
  <style>
    body { margin:0; padding:0; }
    #map { position:absolute; top:0; bottom:0; width:100%; }
  </style>
</head>
<body>
<style>
  #layers {
    background: #fff;
    position:absolute;
    top:20px;
    left:20px;
    z-index: 1000;
    padding: 10px;
  }
</style>
<div id='layers'></div>
<div id='map'></div>
<script>
  var map = mapbox.map('map');
  var layers = document.getElementById('layers');

  map.addLayer(mapbox.layer().id('tmcw.map-rep59d6x').named('MapBox Streets').composite(false));
  map.addLayer(mapbox.layer().id('tmcw.newruns').named('My Runs').composite(false));
  map.zoom(12).center({ lat: 38.9, lon: -77 });

  // Create a simple layer switcher that toggles layers on
  // and off.
  for (var i = 0; i < map.getLayers().length; i++) {
      var n = map.getLayerAt(i).name;
      var container = document.createElement('div');
      var input = document.createElement('input');
      var label = document.createElement('label');
      input.type = 'button';
      input.id = input.value = n;
      input.checked = 'checked';
      input.onchange = function() {
          map.getLayer(this.value).enabled ?
              map.getLayer(this.value).disable() :
              map.getLayer(this.value).enable();
      };
      label.innerHTML = n;
      label.setAttribute('for', n);
      container.appendChild(input);
      container.appendChild(label);
      layers.appendChild(container);
  }
</script>
</body>
</html>