ES6 iterable Map example

iterable.js

<script>
  const els = document.querySelectorAll('li')

  const iterables = new Map([
    ['myObject', {
      appetizer: 'Soup',
      entree: 'Mahi Mahi',
      dessert: 'Pie!'
    }],
    ['myArray', [
      'avocado',
      'tomato',
      'onion',
      'lime'
    ]]
  ])

  iterables.set('myCollection', els)

  const iterate = (e) => {
    const something = iterables.get(e.target.innerHTML)
    console.log(something)
  }

  els.forEach((el) => {
    el.addEventListener('click', iterate)
    // click results:
    // {appetizer: "Soup", entree: "Mahi Mahi", dessert: "Pie!"}
    // ["avocado", "tomato", "onion", "lime"]
    // [li, li, li]
  })
</script>      

<div>
  <h2>Are we having fun yet?</h2>
  <ul>
    <li>myObject</li>
    <li>myArray</li>
    <li>myCollection</li>
  </ul>
</div>