How to use the same id in several locations on the same page
I would like to display the same map in different location on the same page. I realize duplicate id are not allowed in HTML, but I think there should be a way to do this in JavaScript and/or classes? Can an id be copied and assigned to a new id to bypass the HTML duplicate ID restriction?
Thank you for any assistance.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Same Map in multiple locations on the same page</title>
</head>
<body>
<h2>Map 1</h2>
<div id="testMap"></div>
<hr>
<h2>Map 2 (identical)</h2>
<div id="testMap" ></div>
</body>
</html>
Thank you for any assistance.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Same Map in multiple locations on the same page</title>
</head>
<body>
<h2>Map 1</h2>
<div id="testMap"></div>
<hr>
<h2>Map 2 (identical)</h2>
<div id="testMap" ></div>
</body>
</html>
front-end