I am trying to add "addEventListener", I was testing one of the examples but it's not working. Can anybody tell me what I am doing wrong or missing something?
<body>
<div class="emoji-row ng-scope" ng-repeat="...">
<div class="emoji-wrapper">
<div class="emoji-reactions">
<div class="emoji-reactions-main">
:)
</div>
<div class="emoji-reactions-panel">
<ul>
<li> :) </li>
<li> :( </li>
</ul>
</div>
</div>
</div>
<span class="helloemoji"></span>
</div>
<script>
const tag = document.createElement("span");
tag.className = 'helloemoji';
document.getElementsByClassName("emoji-row")[0].appendChild(tag);
const emojis = document.getElementsByClassName("emoji-reactions-panel")[0].getElementsByTagName("li");
console.log(emojis.length); /* 5 */
Array.from(emojis).forEach(function (item) {
console.log("item", item);
item.addEventListener('click', emojiClickfunc);
});
function emojiClickfunc() {
console.log("clicked...")
alert('clicked...');
}
</script>
<!-- style -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
I created a sample example, but strange it's working there! but not with my above code :(
Would appreciate some guidance on how I can resolve this.
EDIT:
while doing random changes, add click on a window
Array.from(emojis).forEach(function (item) {
console.log("item", item);
window.addEventListener('click', emojiClickfunc);
});
I am struggling to try and find a solution to this. I need to find out which line of an unordered list was clicked by item, not through a window.