How to call function while click <a> that inside the infoBubble content?

I am a new beginner try to add a google map in my website, and there have some problems. I am trying to add some markers with the infobubble in the google map, then i want to add inside the infobubble content, after click on the , a function will be call, but infobubble seems different with infowindow, i have try to search many methods and still can't do this.

Here is my example:

function createMarker(point, locations, map) {


var content = '<a id="test" href="#">Deatils Information</a>';

var infoBubble = new InfoBubble({
    minWidth: 300,
    minHeight: 150,
    padding: 15,
    hideCloseButton: true,
    borderRadius: 0,
    content: content
});


var marker = new google.maps.Marker({
    position: point,
    map: map
});


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



};

I have search and find many examples,

$("#test").live("click", function(){
alert("clicked");           
});

this function is only work inside the infowindow.

and

$(infoBubble.bubble_).live("click", function() {
  alert('clicked!');
});

this function do not have any response,

if there any methods can do this function? Or somethings i should be read if i want to solve this problems? Please give me some hints. Thank you very much!!

Your problem is the HTML "string" in the infobubble is not part of the DOM until after the infobubble is created and rendered.

This should work:

function testClick() {
  alert("clicked!");
}

and in your infowindow/infobubble:

 var content = '<a id="test" href="javascript:testClick();">Deatils Information</a>';