Change google maps marker on click
<p>Hey I have a product loop where each product has its own data-location="number" </p>

<p>I want to be able to change the marker icon on click of one of the buttons according to its location.</p>

<pre><code>&lt;button class="btn" data-location="80"&gt;&lt;/button&gt;
&lt;button class="btn" data-location="81"&gt;&lt;/button&gt;
&lt;button class="btn" data-location="82"&gt;&lt;/button&gt;
</code></pre>

<p>so that marker with data-location="80" becomes green or changes the image on click</p>

<p>here is my addMarker function</p>

<pre><code>function addMarker(location) {
    location.Position = { 
        lat: parseFloat(location.mapURL.split(',')[0]),
        lng: parseFloat(location.mapURL.split(',')[1]) 
    };

    location.Marker = new google.maps.Marker({
        icon: 'images/map-marker-blue-2.png',
        map: map,
        position: location.Position,
        title: location.name,
    });
}
</code></pre>

<p>let me know if you need more info</p>