title: Change marker color "onclick"
body: <p>I would like to change the color of selected marker.</p>
  
  <p>I'm using the following code:</p>
  
  <pre class="lang-js prettyprint-override"><code>// arrays to hold copies of the markers and html used by the side_bar 
  // because the function closure trick doesnt work there 
  var gmarkers = [];
  var map = null;
  
  function initialize() {
      // create the map
      var myOptions = {
          zoom: 11,
          center: new google.maps.LatLng(51.519243, -0.126661),
          mapTypeControl: true,
          mapTypeControlOptions: {
              style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
          },
          navigationControl: true,
          mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      map = new google.maps.Map(document.getElementById("map-canvas-big"),
          myOptions);
      google.maps.event.addListener(map, 'click', function() {
          infowindow.close();
      });
      var point = new google.maps.LatLng(51.5608308012934, -0.0540925428914196);
      var marker = createMarker(point, " Clapton ", "&lt;div class='scrittafumetto' id='proprieta_4940'&gt;&lt;strong&gt;&lt;div class='titolo'&gt; Title&lt;/div&gt;&lt;/strong&gt;&lt;br /&gt;&lt;a class='mostra_vedi'&gt;Vedi&lt;/a&gt;&lt;/span&gt;&lt;/div&gt;");
  }
  
  var infowindow = new google.maps.InfoWindow({
      size: new google.maps.Size(150, 50)
  });
  
  google.maps.event.addListener(marker, 'click', function(marker, i) {
      var marker_id = marker.id;
  
  
      if ($('#new-overview-main_' + marker_id).css('display') == 'block') {
          $('#new-overview-main_' + marker_id).css('display', 'none');
      } else {
          $('#new-overview-main_' + marker_id).css('display', 'block');
      }
  
  });
  
  function createMarker(latlng, name, html) {
      var contentString = html;
      var marker = new google.maps.Marker({
          position: latlng,
          map: map,
          zIndex: Math.round(latlng.lat() * -100000) &lt;&lt; 5
      });
  
      google.maps.event.addListener(marker, 'click', function() {
          infowindow.setContent(contentString);
          infowindow.open(map, marker);
      });
      // save the info we need to use later for the side_bar
      gmarkers.push(marker);
      // add a line to the side_bar html
  }
  </code></pre>
  
  <p>already tried to add this code</p>
  
  <pre><code>marker.setIcon('https://www.google.com/mapfiles/marker_green.png');
  </code></pre>
  
  <p>within the "createmarker" function, it works but not how I would like to have.</p>
  
  <p>Basically, it changes the marker color when I click on it but, when I select another marker, the "old" one remain with the "marker_green.png" icon.</p>
  
  <p>What I would like to have is to change the color only for selected marker, in order to recognize the clicked marker among the others.</p>
  
  <p>Any tip?
  Thanks, Dean.</p>