Intento devolver ese texto dentro de la lista, pero en su lugar obtengo htmlcollection0
mi JS:
Array.from(document.getElementById("main-menu").getElementsByTagName("li")).forEach( (x) => (x.onclick = () => console.log({ event_name: "menu item clicked", menu_item: x.getElementsByTagName("li"), })) );mi html:
<div id="main-body"> <ol id="main-menu"> <li class="selected">Shop Spirits</li> <li>Shop Bourbon</li> <li>Shop Scotch</li> <li>Shop Rum</li> </ol>x.getElementsByTagName('li') devuelve todos los elementos li anidados dentro de x . No hay ninguno, por lo que devuelve una NodeList vacía.
Si desea registrar el texto del elemento en el que se hizo clic, use x.innerText , no es necesario buscar nada.
Array.from(document.getElementById("main-menu").getElementsByTagName("li")).forEach( (x) => (x.onclick = () => console.log({ event_name: "menu item clicked", menu_item: x.innerText })) ); <div id="main-body"> <ol id="main-menu"> <li class="selected">Shop Spirits</li> <li>Shop Bourbon</li> <li>Shop Scotch</li> <li>Shop Rum</li> </ol>