Can’t generate code snippet data

I am trying to populate a drop down with data from SQL.

I currently have a php snippet that does the following:

function populateMake() {
global $wpdb;

// Initialize an empty HTML string for options
$htmlOptions = '';

// Query for distinct 'make' values from your table
$query = "SELECT DISTINCT make FROM vehicles";
$results = $wpdb->get_results($query);

// Build HTML options for the makeDropdown
foreach ($results as $result) {
  $make = $result->make;
  $htmlOptions .= "<option value=\"$make\">$make</option>";
}

// Output the HTML options
return $htmlOptions;
}
add_shortcode('populateMake_shortcode', 'populateMake');

Then, I am trying to call the shortcode through a Javascript code snippet:

<script>
	
document.addEventListener('DOMContentLoaded', function() {
	
function injectCustomDropdown() {
  const makeDropdown = document.getElementById('makeDropdown');

  // Generate the shortcode with the specified content
  const shortcode = '<?php echo do_shortcode("[populateMake_shortcode]");?>';

  // Set the HTML of the makeDropdown to the generated shortcode
  document.getElementById('makeDropdown').insertAdjacentHTML('beforeEnd', shortcode);
  //makeDropdown.innerHTML = shortcode;
}
	
injectCustomDropdown();
	
});

</script>

Since this is a HTML snippet, I can’t get the php to show. Is there a way around this? It reads it as a comment, shows in the console as <!–php ……

Thanks in advance!