clonar_elementos_dom.js

clonar_elementos_dom.js

   <script type="text/javascript">
          window.addEventListener("load", function(e) {
            let templete = document.getElementById("article-template");
            let articles = document.getElementById("articles");
            for (let i = 1; i <= 5; i++) {
              let clonar = templete.cloneNode(true);
              clonar.removeAttribute("id");
              let h2 = clonar.getElementsByTagName("h2")[0];
              h2.innerHTML = h2.textContent + " " + i;
              articles.appendChild(clonar);
            }
          });
        </script>

        <!--LISTADO ARTICULOS-->
        <div id="articles">
          <article class="article-item" id="article-template">
            <div class="image-wrap">
              <img
                src="https://cflvdg.avoz.es/default/2016/06/07/00121465331825011951185/Foto/.jpg"
                alt="Paisaje"
              />
            </div>

            <h2>Articulo de Prueba</h2>
            <span class="date">Hace 5 min</span>
            <a href="">Leer más</a>
          </article>
          <!-- Anadir articulos via js -->
        </div>