DOM & Events — Series 3

// <ul id="list"><li class="item">One</li><li class="item">Two</li></ul>
const items = document.querySelectorAll('.item');
const live = document.getElementById('list').children;

document.getElementById('list').insertAdjacentHTML('beforeend', '<li class="item">Three</li>');

console.log(items.length, live.length, Array.isArray(items));

let count = 0;
const handler = () => count++;
const btn = document.getElementById('btn');

btn.addEventListener('click', handler);
btn.addEventListener('click', handler);
btn.addEventListener('click', () => count++);

btn.click();
console.log(count);

// <ul id="list"><li id="one">One</li><li>Two</li></ul>
const results = [];
const list = document.getElementById('list');

list.addEventListener('click', function (e) {
  results.push(e.target.tagName, e.currentTarget.tagName, String(this === e.currentTarget));
});

document.getElementById('one').click();
console.log(results.join(','));