JSFiddle - React, Tailwind, and code Playground

by CarlosAlexandreleutz

HTML

<div id="paiDeTodos">

            </div>

JavaScript

let array = [{"id":"5e917252-17c6-4490-91e7-129240a4e85a","descricao":"string","descricaoPai":null},{"id":"a776650a-3c43-4355-830c-686cd21d18aa","descricao":"teste","descricaoPai":null},{"id":"4a50a6ee-ed54-44f8-8b55-c565a14dad05","descricao":"Filho do teste","descricaoPai":"teste"}]
var conter = 0;
function verificaRelacionamento (element){
  conter++
  let elemento = element;
  let div = document.createElement('div');
  div.textContent = `Id: ${elemento.id} Descrição: ${elemento.descricao} Descrição do pai ${elemento.descricaoPai}`;
  let idRotativo = 'teste' + conter;
  div.setAttribute("id", idRotativo)
  div.setAttribute("onclick", `alertaID("${idRotativo}")`)
  let paiDeTodo = document.getElementById('paiDeTodos');
  paiDeTodo.appendChild(div)                                             
}
array.forEach(verificaRelacionamento)

 function alertaID (a){
            alert(a)

        }