Wordpress - enqueue script only if specific class is on page

What would be the most appropriate solution to enqueue a script in WordPress only when a class of .google-map is detected on that page?

In my main.js I can detect the item on the page and do something, but I am not so sure you can use the enqueue function in a JS file.

$(document).ready(function(){
  if (document.getElementsByClassName('.google-map')) {
    alert(true);
  }
});

The above is just attempt #1. Please feel free to provide any other solutions, using functions or anything else. I am simply not too sure what is possible that's why I don't have more examples.

Ordinarily add the file google.js (or whatever name you choose) to WP footer by adding the code below into your functions.php file. This will add the javascript file into WP footer the right way. https://developer.wordpress.org/reference/functions/wp_enqueue_script/

function my_scriptings_scripts() {  

    wp_enqueue_script( 'my_scriptings', get_template_directory_uri() . '/js/google.js', array('jquery'), '20171212', true );

}

add_action( 'wp_enqueue_scripts', 'my_scriptings_scripts' );

Inside your js/google.js

Using Vanilla javascript, check for the element with class name. If it exists then call the function for the action.

var element =  document.getElementByClassName('google-map');
  if (typeof(element) != 'undefined' && element != null)
  { 
     //call function for google actions
     google_acts_like_this();
  }

function google_acts_like_this(){
  console.log('Google will take over the world');
  alert('Google will take over the world');
}

OR Try with Jquery -

 if ($(document).find(.google-map).length > 0) 
   { 
      //If the element exist, then do something.
      google_acts_like_this();
   }

function google_acts_like_this(){
      console.log('Google will take over the world');
      alert('Google will take over the world');
    }