JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<div class="map">
  <div id="map_canvas" style="width: 642px; height: 300px;"></div>
</div>   
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

JavaScript

// Global Variable
var map;

// This is a global Function
function initialize() 
{ 
  // This variable is scoped only for the initialize function,
  // it is not available to other functions scoped globally
  var myOptions = 
  { 
    center: new google.maps.LatLng(-34.397, 150.644), 
    zoom: 8, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
  };

  // Instead of a function scoped map variable this should be global
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  google.maps.event.trigger(map, 'resize') 
} 

$(function() 
{
  initialize();
    
  $('.action').click(function() 
  {          
    var name = $(this).attr("name");
    var content = $('.content[name=' + name + ']');
    $('.content').not(content).hide('fast');
    content.slideToggle('fast');
    google.maps.event.trigger(map, 'resize');
  });
});