Estoy generando algunos div y agregando al DOM con esta función
//Run forEach method on newObj(cats from local storage) to populate and append template to the DOM function getTheCats() { //Limiting the results to 3. Probably better way to do this. newObj.slice(0, 3).forEach(cat => { const catEl = document.createElement('div') catEl.classList.add('cat-detail') catEl.innerHTML = ` <div class="img-id-container" id="pointer-control" onclick="getCatDeets()"> <img class='cat-image' src='${cat.thumbnail_url}' alt="Cat Pic"/> <h3 class="id-left">Cat ${cat.id}</h3> </div> <p class="birthday-left">${cat.birthdate}</p> ` mainLeft.appendChild(catEl) }) } getTheCats()Estoy tratando de iniciar sesión en la consola, algunos de los HTML internos cuando hago clic en uno de los resultados. Siempre obtengo 'indefinido' como resultado. Sé que me estoy perdiendo algo, pero parece que no puedo averiguar qué. Cualquier ayuda sería muy apreciada.
function myFunction(event) { const clickedCat = event.target.nodeName; console.log(clickedCat); const details = clickedCat.innerHTML console.log(details) }De David784 en los comentarios,
Innecesariamente agregué .nodeName a event.target. Lo reemplacé con .innerHTML y puedo recuperar los datos que necesito.
function myFunction(event) { const clickedCat = event.target.innerHTML; console.log(clickedCat); const details = clickedCat.innerHTML console.log(details) }