Alchemy Picnic!

For each picnic item:

  • Grab the element and save it as a variable (using getElementById)
  • Add an event listener for clicking on the element (using addEventListener)
  • Toggle the class "picked" for the element (classList has a method called toggle similar to add or remove)
  • Do this one item at a time and commit for each picnic item (you should have at least 5 commits)

Stretch

  • Add a button that will pick a random item from your picnic basket and add it to your picnic
  • Add drag and drop to your items (hint: drag and drop are events just like clicking)
  • Keep track of how many items have been picked and only allow users to select at most 3 items