Infobubble only displaying content from last marker added via PHP/Mysql with tabs

I've been trying to get Infobubbles to work with 2 tabs on a map populated with markers from a Mysql database with an ajax call.

The problem is that every infobubble is displaying the same content in the tabs, from the last marker added. Here is the entire js script, any help is greatly appreciated.

      var script = '<script type="text/javascript" src="http://google-maps-' +
      'utility-library-v3.googlecode.com/svn/trunk/infobubble/src/infobubble';
  script += '.js"><' + '/script>';
  document.write(script);

var customIcons = { 
  free: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png', 
    animation: google.maps.Animation.DROP,
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
  }, 
  paid: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png', 
    animation: google.maps.Animation.DROP,
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
  } 
}; 

// End Custom Icons 

 var map, infoBubble; 

function initialize() { 
    var myOptions = { 
      zoom: 13, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById('map'), 
        myOptions); 

    // Try HTML5 geolocation 
    if(navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(position) 
        { 
        var pos = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); 

        var marker = new google.maps.Marker({ 
          map: map, 
          position: pos, 
                      icon:'images/markers/you.png', 
                      animation: google.maps.Animation.DROP, 
          title: 'Your Location.' 
        }); 

    infoBubble = new InfoBubble({
      maxWidth: 300,
      borderRadius: 10,
      borderWidth: 1,
      borderColor: '#2c2c2c',
      shadowStyle: 1
    });


  var infoWindow = new google.maps.InfoWindow; 

  // Change this depending on the name of your PHP file 
  downloadUrl("phpsqlajax_genxml.php", function(data) {
    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    for (var i = 0; i < markers.length; i++) 
    { 
        var name = markers[i].getAttribute("name"); 
        var address = markers[i].getAttribute("address"); 
        var citystate = markers[i].getAttribute("citystate"); 
        var phone = markers[i].getAttribute("phone"); 
        var type = markers[i].getAttribute("type");  
        var point = new google.maps.LatLng( 
          parseFloat(markers[i].getAttribute("lat")), 
          parseFloat(markers[i].getAttribute("lng"))); 
        var html = "<b>" + name + "</b> <br/>" + address + "<br/>" + citystate + "<br/>" + phone;  //html inside InfoWindow 
        var description = "<b>" + name + "</b> <br/>" + address + "<br/>" + citystate + "<br/>" + phone;  //html inside InfoWindow
        var icon = customIcons[type] || {}; 
        var marker = new google.maps.Marker({ 
            map: map, 
            position: point, 
            icon: icon.icon, 
            shadow: icon.shadow,
            animation: google.maps.Animation.DROP
        }); 
        bindInfoWindow(marker, map, infoBubble, html, description); 
    } 
    infoBubble.addTab('Tab 1', html);
    infoBubble.addTab('Tab 2', description);

  }); 


        map.setCenter(pos); 
      }, function() { 
        handleNoGeolocation(true); 
      }); 
    } else { 
      // Browser doesn't support Geolocation 
      handleNoGeolocation(false); 
    } 
  } 


  function handleNoGeolocation(errorFlag) { 
    if (errorFlag) { 
      var content = 'Error: The Geolocation service failed.'; 
    } else { 
      var content = 'Error: Your browser doesn\'t support geolocation.'; 
    } 

    var options = { 
      map: map, 
      position: new google.maps.LatLng(60, 105), 
      content: content 
    }; 

    var infoBubble = new google.maps.infoBubble(options); 
    map.setCenter(options.position); 
  } 

// Additional functions related to the DB Listing function 

function bindInfoWindow(marker, map, infoBubble, html) { 
  google.maps.event.addListener(marker, 'click', function() { 
    //infoBubble.setContent(html); 
    infoBubble.open(map, marker);
  }); 
} 

function downloadUrl(url, callback) { 
  var request = window.ActiveXObject ? 
      new ActiveXObject('Microsoft.XMLHTTP') : 
      new XMLHttpRequest; 

  request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
      request.onreadystatechange = doNothing; 
      callback(request, request.status); 
    } 
  }; 

  request.open('GET', url, true); 
  request.send(null); 
} 

function doNothing() {} 

  function addTab() {
    var title = document.getElementById('tab-title').value;
    var content = document.getElementById('tab-content').value;

    if (title != '' && content != '') {
      infoBubble.addTab(title, content);
    }
  }
  google.maps.event.addDomListener(window, 'load', initialize); 

The code that sets the content depending on the marker is commented out:

//infoBubble.setContent(html);

Therefor the content of the last infowindow created is always displayed.

working example, including the tab content