Skip to main content
Tenía algunos errores, éste código que presento es javascript puro
Origen Enlace

Ésta puede ser una opción, se recomienda que si cada caja tiene algo diferente, se le asigne un id y no trabajarlo todo con la clase.

    function addTitle() {
        let col = document.querySelectorAll('.col');
           col.forEach(boxService, function(boxService,index){
           let titleelementH2 = document.createElement("h2");
           let titleNodenewText = titledocument.createTextNode(services[index].name);
           boxServiceelementH2.insertAdjacentHTMLappendChild("afterbegin",titleNodenewText);
         }boxService.prepend(elementH2);
    }

Ésta puede ser una opción, se recomienda que si cada caja tiene algo diferente, se le asigne un id y no trabajarlo todo con la clase.

    function addTitle() {
        let col = document.querySelectorAll('.col');
           col.forEach(boxService, function(){
           let title = document.createElement("h2");
           let titleNode = title.createTextNode(services[index].name);
           boxService.insertAdjacentHTML("afterbegin",titleNode);
         })
    }

Ésta puede ser una opción, se recomienda que si cada caja tiene algo diferente, se le asigne un id y no trabajarlo todo con la clase.

function addTitle() {
     let col = document.querySelectorAll('.col');
       col.forEach( function(boxService,index){
       let elementH2 = document.createElement("h2");
       let newText = document.createTextNode(services[index].name);
       elementH2.appendChild(newText);
       boxService.prepend(elementH2);
 }
Origen Enlace

Ésta puede ser una opción, se recomienda que si cada caja tiene algo diferente, se le asigne un id y no trabajarlo todo con la clase.

    function addTitle() {
        let col = document.querySelectorAll('.col');
           col.forEach(boxService, function(){
           let title = document.createElement("h2");
           let titleNode = title.createTextNode(services[index].name);
           boxService.insertAdjacentHTML("afterbegin",titleNode);
         })
    }