Google map API- display alternative routes with distance on info window
<p>I am using google map and I am bit stuck at one point. I want to display alternative routes for my source and destination point. Currently I am using the code which is working perfectly and displaying correct result but the only the problem is that this code displaying <code>infowindow</code> for all routes with distance and time. And it needs to be differently colored for alternative routes..</p>

<p>Please help me out.</p>

<pre><code>var request = {
                origin: source,
                destination: destination,
                travelMode: google.maps.TravelMode.DRIVING,
                provideRouteAlternatives: true,
                optimizeWaypoints
                unitSystem: google.maps.UnitSystem.METRIC
            };
            directionsService.route(request,
                function(response, status) {
                    if (status == google.maps.DirectionsStatus.OK) {                    
                    var step=2;
                        for (var i = 0, len = response.routes.length; i &lt; len; i++) {
                            new google.maps.DirectionsRenderer({
                                map: mapObject,
                                directions: response,
                                routeIndex: i
                            });                         
                            stepDisplay.setContent(response.routes[i].legs[i].steps[step].distance.text + "&lt;br&gt;" + response.routes[i].legs[i].steps[step].duration.text + " ");
            stepDisplay.setPosition(response.routes[i].legs[i].steps[step].end_location);
            stepDisplay.open(mapObject);
                        }
                    } else {
                        $("#error").append("Unable to retrieve your route&lt;br /&gt;");
                    }

                });
</code></pre>