geoxml3 adding events on placemarks - geoxml3

Question

I am trying to add events on placemarks but getting an error 'docs is undefined'. When I try and alert the names of the placemarks, they work fine so why not the events?
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
var geoXml = new geoXML3.parser({
map: this.map,
singleInfoWindow:true,
afterParse: this.useTheData
});
geoXml.parseKmlString(<my kml string>);
google.maps.event.addListener(this.map, "bounds_changed", RefreshMap);
google.maps.event.addListener(this.map, "center_changed", RefreshMap);
google.maps.event.addListener(this.map, "zoom_changed", RefreshMap);
},
useTheData: function(doc) {
for (var i = 0; i < doc[0].placemarks.length; i++) {
docs[0].placemarks[i].events.add("click", function () {alert("event!!");});
//alert(docs[0].placemarks[i].name);
}
}

Answer 1

"docs" is undefined. The local version is "doc".
the .placemark is a JSON representation of the Placemark, not a google maps object that will handle click events.
It contains a reference to the google maps object (.placemark.marker for a marker) that you can add a click event listener to.
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
var geoXml = new geoXML3.parser({
map: this.map,
singleInfoWindow:true,
afterParse: this.useTheData
});
geoXml.parseKmlString(<my kml string>);
google.maps.event.addListener(this.map, "bounds_changed", RefreshMap);
google.maps.event.addListener(this.map, "center_changed", RefreshMap);
google.maps.event.addListener(this.map, "zoom_changed", RefreshMap);
},
useTheData: function(doc) {
for (var i = 0; i < doc[0].placemarks.length; i++) {
google.maps.event.addListener(
doc[0].placemarks[i].marker,
"click",
function () {alert("event!!");
});
//alert(docs[0].placemarks[i].name);
}
}