title: Open a Google Maps Infowindow from external link
body: <p>I am currently creating a bit of a Google Maps application using Javascript API v3. It's a map of results from a wordpress database, which dynamically populates the map, creating markers on the map, and on a sidebar the list of wordpress articles.</p>
  
  <p>What I'm trying to do is the following :</p>
  
  <p>when clicking on the link of the wordpress article on the sidebar, instead of going immediately on the article, it have to open the corresponding infowindow on the map. I tried to do it with JQuery, binding a click event on the link to open the infowindow, but unfortunately, it keeps opening the last infowindow created.</p>
  
  <p>I do understand the issue here : JQuery evaluates the 'marker' variable only when the event is fired, thus using the last known value of the variable.</p>
  
  <p>What I want to do is actually evaluates the 'marker' variable WHILE IN THE LOOP. And there I'm stuck. If anyone can help me on this one, I'll be really grateful.</p>
  
  <p>Thanks for the time you'll take to answer me.</p>
  
  <p>Here's a link to the app : <a href="http://88.191.128.36/buddypress/carte/" rel="nofollow">http://88.191.128.36/buddypress/carte/</a></p>
  
  <p>and here the function itself : </p>
  
  <pre><code>    function setMarkers(map, markers) {
      for (var i = 0; i &lt; markers.length; i++) {
          var sites = markers[i];
          var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);
  
          if( sites[4] == '10'){
              var MarkerImage = new google.maps.MarkerImage('http://dediope.inovawork.net/buddypress/wp-content/themes/TheSource/images/marker-hotel.png');
        } else if (sites[4] == '9') {
              var MarkerImage = new google.maps.MarkerImage('http://dediope.inovawork.net/buddypress/wp-content/themes/TheSource/images/marker-golf.png');
          }
  
          var marker = new google.maps.Marker({
              position: siteLatLng,
              map: map,
              icon: MarkerImage,
              title: sites[0],
              html: '&lt;div&gt;&lt;b&gt;' + sites[0] + '&lt;/b&gt; &lt;br /&gt; &lt;a href="' + sites[3] + '"&gt; Voir la fiche de ce lieu &lt;/a&gt;&lt;/div&gt;'
          });
  
  
      marker_array[i] = marker ;
  
      // THIS IS WHERE I NEED HELP :)
      $j('#results_entry li .title:contains("' + sites[0] + '")').bind('click', function(){  infowindow.setContent(  marker.html ); infowindow.open( map, marker ); }) ; 
  
         var contentString = '&lt;div&gt;&lt;b&gt;' + sites[0] + '&lt;/b&gt; &lt;br /&gt; &lt;a href="' + sites[3] + '"&gt; Voir la fiche de ce lieu &lt;/a&gt;&lt;/div&gt;';
  
         var infowindow = new google.maps.InfoWindow({
              content: contentString
          });
  
         google.maps.event.addListener(marker, "click", function () {
             infowindow.setContent(this.html);
             infowindow.open(map, this);
          });       
      }
  }
  </code></pre>
  
  <p>PS : Sorry if I didn't explain very well, I'm french so my english isn't perfect :)</p>