IE7/8 javascript "SCRIPT5007: Unable to get value of the property"

Question

I've got a site under development which uses Google Maps API V3 to load multiple location makers. Everything is working except in IE7/8 where my looping through an array fails due to the following error:

SCRIPT5007: Unable to get value of the property '5': object is null or undefined

I've looked through all similar questions on StackOverflow and can't find any solution.

So I'm trying to access data from an object array (I also tried a nested array but the same error occurs). My array is as below. I have also tried dropping the html object in case that was causing an issue, but no change - IE7/8 still can't get the object value.

var sites = [
    {title: "Hermitage Medical Clinic", latitude: 53.3593139774, longitude: -6.40494071541, enumerator: 1, html: "<div class=\"find_a_surgeon_info_inner\"><h4 style=\"margin: 0; padding: 0;\">Hermitage Medical Clinic</h4><p>Old Lucan Road, Dublin 20</p><p><a href=\"http://devel.pixelapes.com/iaps.ie/location/hermitage-medical-clinic/\">View hospital details</a></p></div>", iconTerm: "hospital" }
        ];

And here's my function which is trying to access the data:

        function setMarkers(map, sites) {

            for (var i = 0; i < sites.length; i++) {
                // var sites = markers[i];
                var icon = '<?php bloginfo("template_url"); ?>/images/map-icons/' + sites[i].iconTerm + '.png';
                var siteLatLng = new google.maps.LatLng(sites[i].latitude, sites[i].longitude);
                var marker = new google.maps.Marker({
                    position: siteLatLng,
                    map: map,
                    icon: icon,
                    title: sites[i].title,
                    zIndex: sites[i].enumerator,
                    html: sites[i].html
                });

                var contentString = "Some content";

                google.maps.event.addListener(marker, "click", function () {
                    infowindow.setContent(this.html);
                    infowindow.open(map, this);
                });
            }
        }

I've also tried dropping back to just using the default Maps marker in case there was a specific issue with the iconTerm object but IE7/8 just fails trying to get the next object value.

Here's a page on which this is occurring: http://devel.pixelapes.com/iaps.ie/surgeon/eamon-s-beausang/

Strangely, I have another map instance where I'm not setting the bounds with map.fitBounds. The failure to get object values still occurs but the map sort of loads (but very messily): http://devel.pixelapes.com/iaps.ie/find-a-hospital-or-clinic/

I have tried removing the fitBounds functionality on the single surgeon page but the map still doesn't partially load as it does on the "Find a hospital" map.

Any ideas on how to get around this?

Solution

There are trailing comma's after the last items of sites and latlngs, remove them, IE doesn't like trailing commas in arrays/objects.