JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false&amp;.js"></script>
<div class="click">
    <div class="point">******click here******</div>
  <div class="hide">
    <div id="map" style="width:300px;height:140px;"></div>
  </div> 
</div>

<div class="click">
    <div class="point">******click here******</div>
  <div class="hide">
    <div id="map1" style="width:300px;height:140px;"></div>
  </div> 
</div>

<div class="click">
    <div class="point">******click here******</div>
  <div class="hide">
    <div id="map2" style="width:300px;height:140px;"></div> 
  </div> 
</div>

CSS

body{
    margin:20px;
   
}
.click{
    margin:20px;
    cursor:pointer;
    padding:20px;
    width:300px;
    background:orange;
}
.hide{
    height:140px;
}

JavaScript

$('.hide').hide();

$('.point').click(function(){
    var $this = $(this);
    $this.next('.hide').slideToggle(function initialize(){
    var latlng = new google.maps.LatLng(48.89376,2.33742); //1 location
        var latlng1 = new google.maps.LatLng(40.73717,-73.98439); //2 location
        var latlng2 = new google.maps.LatLng(-8.79069, 115.15927); //3 location
         
	    var settings = {
	    	zoom: 15,
	        center: latlng,
	        disableDefaultUI: true,
            zoomControl: true,
        	mapTypeId: google.maps.MapTypeId.ROADMAP
		};
         var settings1 = {
	    	zoom: 15,
	        center: latlng1,
	        disableDefaultUI: true,
            zoomControl: true,
        	mapTypeId: google.maps.MapTypeId.ROADMAP
		};
    
       var settings2 = {
	    	zoom: 15,
	        center: latlng2,
	        disableDefaultUI: true,
            zoomControl: true,
        	mapTypeId: google.maps.MapTypeId.ROADMAP
		};
    
		var map = new google.maps.Map(document.getElementById("map"), settings);
        var map1 = new google.maps.Map(document.getElementById("map1"), settings1);
        var map2 = new google.maps.Map(document.getElementById("map2"), settings2);
    
        var marker=new google.maps.Marker({
	          position:latlng,
	          });
		 marker.setMap(map);
    
         var marker1 =  new google.maps.Marker({
	          position:latlng1,
	          });
		 marker1.setMap(map1);
    
        var marker2 =  new google.maps.Marker({
	          position:latlng2,
	          });
		 marker2.setMap(map2);
    });
})


google.maps.event.addDomListener(window, 'load', initialize);