Binding jQuery element clicks with Google Map Markers

I am using jQuery to bind my map sidebar as part of my map scripting. When I do this, I just have one tiny problem. When you click on the sidebar links, it always reverts to opening the last marker’s infoWindow.

Which means I binding my links incorrectly or I am trigger the marker event incorrectly. If someone can help point me in the right direction ... much appreciated.

Scripting I am using.

var listings=[new google.maps.LatLng(43,-79),new google.maps.LatLng(43,-79),new google.maps.LatLng(43,-79)];
var names=['name 1','name 2','name 3'];
var descriptions=['description 1','description 2','description 3'];
var image = new google.maps.MarkerImage('/flag.png',new google.maps.Size(24,24),new google.maps.Point(0,0),new google.maps.Point(0,0));
var map;
var box;
function initialize() {
    var moptions = {
        zoom: 6,
        center: new google.maps.LatLng(43,-79),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        visible: true
    }
    var div = document.createElement('div');
    var boptions = {
        content: div,
        disableAutoPan: false,
        maxWidth: 0,
        pixelOffset: new google.maps.Size(-140, 0),
        zIndex: null,
        boxStyle: {
            background: "url('tipbox.gif') no-repeat",
            opacity: 0.75,
            width: "280px"
        },
        closeBoxMargin: "10px 2px 2px 2px",
        closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
        infoBoxClearance: new google.maps.Size(1, 1),
        isHidden: false,
        pane: "floatPane",
        enableEventPropagation: false
    };
    box = new InfoBox(boptions);
    for (var i = 0; i < listings.length; i++) {
        var marker = new google.maps.Marker({
            position: listings[i],
            map: map,
            draggable: false,
            icon: image,
            title: names[i]
        });
        AttachMessage(marker, i);
    }
}
function AttachMessage(marker, number) {
    google.maps.event.addListener(marker, 'click', function() { 
        box.close();
        box.setContent(descriptions[number]);
        box.open(map, marker);
    });

    //this is where I am having the issue ...

    $('#sidebar').find('#marker').unbind('click').bind('clic开发者_StackOverflow中文版k', function (e) {
        google.maps.event.trigger(marker, 'click');
    });
}

Sidebar Marker Links

<div id="sidebar">
    <ul>
        <li><a id="marker" href="#">Marker One</a></li>
        <li><a id="marker" href="#">Marker Two</a></li>
        <li><a id="marker" href="#">Marker Three</a></li>
    </ul>
</div>

---

Solved this one by creating a maker array and adding it to my scripting

var listings=[new google.maps.LatLng(43,-79),new google.maps.LatLng(43,-79),new google.maps.LatLng(43,-79)];
var names=['name 1','name 2','name 3'];
var descriptions=['description 1','description 2','description 3'];
var image = new google.maps.MarkerImage('/flag.png',new google.maps.Size(24,24),new google.maps.Point(0,0),new google.maps.Point(0,0));
var markers = [];
var map;
var box;
function initialize() {
    var moptions = {
        zoom: 6,
        center: new google.maps.LatLng(43,-79),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        visible: true
    }
    var div = document.createElement('div');
    var boptions = {
        content: div,
        disableAutoPan: false,
        maxWidth: 0,
        pixelOffset: new google.maps.Size(-140, 0),
        zIndex: null,
        boxStyle: {
            background: "url('tipbox.gif') no-repeat",
            opacity: 0.75,
            width: "280px"
        },
        closeBoxMargin: "10px 2px 2px 2px",
        closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
        infoBoxClearance: new google.maps.Size(1, 1),
        isHidden: false,
        pane: "floatPane",
        enableEventPropagation: false
    };
    box = new InfoBox(boptions);
    for (var i = 0; i < listings.length; i++) {            
        var marker = new google.maps.Marker({
            position: listings[i],
            map: map,
            draggable: false,
            icon: image,
            title: names[i]
        });
        markers.push(marker);
        AttachMessage(marker, i);
    }
}
function AttachMessage(marker, number) {
    google.maps.event.addListener(marker, 'click', function() { 
        box.close();
        box.setContent(descriptions[number]);
        box.open(map, marker);
    });
}
function OpenMessage(i) {
    google.maps.event.trigger(markers[i],'click');
};