I've got a working section of google maps javascript, I did have a problem.

Now the issue I had was that only one infowindow was showing up, the last. I found a solution on another stack thread that worked out. But I couldn't really work out why. I'm fairly new to Javascript so I was hoping someone could explain to me what changed and how.

Here is the working code:

function setMarkers(map, locations){

  for(var i = 0; i < locations.length; i++){

    var marker = locations[i];

    var latLng = new google.maps.LatLng(locations[i][1], locations[i][2]);

    var content = locations[i][0];

    var infowindow = new google.maps.InfoWindow();



    marker = new google.maps.Marker({

      position:latLng,

      map: map

    });



    google.maps.event.addListener(marker, 'click', function(content){

      return function(){

        infowindow.setContent(content);

        infowindow.open(map, this);

      }

    }(content));

  }

}

Here is the original broken code was (I'll paste only that which changed):

 google.maps.event.addListener(marker, 'click', function(){

      infowindow.setContent(content);

      infowindow.open(map, marker);

    });

Now what I'd like to know if you'd be so kind, is:

1. what function does the return fn serve, and




2. what does the added (content) at the end of addListener (}(content));) do since as far as I can see the content has already been set within the setContent property.

Thank-you!