This is the code I am using. I am unable to render components in div with same class name, but its strange, if I am using divs, one with id and one with class, it's rendering fine. If I add the 3rd one, it's not rendering.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<title>React App</title>
</head>
<body>
<div class="team-container"></div>
<div id="a" ></div>
<div id="b" ></div>
<div id="c" ></div>
<div id="d" class= "team"></div>
<script>
function renderComponent(id){
$(document).ready(function () {
$(id).load(
"private component url link"
); // Handler for .ready() called.
});
}
//renderComponent("#a")
renderComponent("#d")
renderComponent(".team-container")
</script>
</body>
</html>