title: Javascript error: Uncaught ReferenceError: marker1 is not defined
body: <p>I am using the following code to cause the marker on the map to change when a user places his mouse over a div. Marker1 is definied within initialize() as follows:</p>
  
  <pre><code>var marker1 = new google.maps.Marker({  
  
                  position: new google.maps.LatLng(1.288693,103.846733),
  
                  map: map,
  
                  icon: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&amp;chld=1|c41200|ffffff"
  
              });
  </code></pre>
  
  <p>the function called onmouseover is:</p>
  
  <pre><code>function changeMarker(marker) {
              var icon = new Google.maps.MarkerImage({ url:"http://chart.apis.google.com/chart?chst=d_map_pin_letter&amp;chld=1|ffffff|c41200"});
              marker.setIcon(icon);
          }
  </code></pre>
  
  <p>and the div is:</p>
  
  <pre><code>&lt;div id="searchresult" onmouseover="changeMarker(marker1)"&gt;
  </code></pre>
  
  <p>I get the same error:     Uncaught ReferenceError: marker1 is not defined</p>
  
  <p><strong>Attempt 2</strong></p>
  
  <p>I tried adding the following line outside the initialize() function </p>
  
  <pre><code>var marker1;
  </code></pre>
  
  <p>and i get the error:    Uncaught ReferenceError: Google is not defined</p>
  
  <p>My javascript is not great, do I make a mistake somewhere?</p>