Tengo una pregunta sobre el desarrollo de HTML/JS.

Así que tengo un elemento que representa una sección que contiene algunos datos como el nombre del trabajo, la localización.

Esos datos provienen de una tabla SQL que contiene algunos anuncios de trabajo.

Entonces, mi pregunta es cómo puedo duplicar esta sección para cada anuncio de trabajo sin volver a escribir la sección cada vez que llamo nuevos datos de mi base de datos.

espero que haya sido claro

Puedes ver aquí mi código HTML.

 <div class="container"> <div class="row"> <div class="col-sm"> <section class="py-5"> <div class="container px-4 px-lg-5 mt-5"> <div class="row gx-4 gx-lg-5 row-cols-2 row-cols-md-3 row-cols-xl-4 justify-content-center"> <div class="col mb-5"> <div class="card h-100"> <!-- Product image--> <img class="card-img-top" src="https://dummyimage.com/450x300/dee2e6/6c757d.jpg" alt="..." /> <!-- Product details--> <div class="card-body p-4"> <div class="text-center"> <!-- Product name--> <h5 class="fw-bolder"> <div id="table-container"></div> </h5> <!-- Product price--> </div> </div> <div class="dropdown"> <div class="card-footer p-4 pt-0 border-top-0 bg-transparent"> <div class="text-center dropbtn"><a class="btn btn-outline-dark mt-auto" href="#" onclick="display_h()">Learn More</a></div> <div class="dropdown-content"> <a href="#">Description</a> <a href="#">Adresse</a> <a href="./form.html">Apply</a> </div> </div> </div> </div> </div> </div> </div> </div> </section> </div> </div>

Gracias