# DOM + Events Feature Set

## Feature: Turn Links on a Page Into Wikipedia Style Citations (Morning Review should we get to it)

**Scenario:** When Max first enters the site, instead of traditional anchor tags that link to other places, they should see Wikipedia-style citations

**Implementation Details:**

- Create superscript tags based on each anchor tag
- Change the innerHTML of the superscripts so that they can be links themselves
- Don't forget to increment the actual number of the superscript
- Insert the superscript tag after the text of the original after tag; before the rest of the text of the paragraph
- Create new text nodes for the anchors' texts
- Insert the text before the superscript
- Remove the anchor tags

## Feature: The Awesome Button

**Scenario**: When Katie clicks on the `awesome` button, remove the first paragraph, and replace it with an image

Image to use: [https://media.giphy.com/media/mbhseRYedlG5W/giphy.gif](https://media.giphy.com/media/mbhseRYedlG5W/giphy.gif)

## Feature: The Coffee Table Generator Button

**Scenario**: When Clare clicks on the `generate-coffee-table` button, generate a 3x3 grid that has the same images of coffee in each cell

Image to use: [https://media.giphy.com/media/l09Cqx9PUMCPi8H65V/giphy.gif](https://media.giphy.com/media/l09Cqx9PUMCPi8H65V/giphy.gif)

**Implementation Details**:

- Grab the 'generate-coffee-table' button
- Create a function that does the following:
- Create a table element
- Grab the div called "insert-table" to insert the new table element
- Loop to create the rows
- Nest another loop to create the cells
- Create images for each cell and give the image source above
- Append the images to each cell
- Append the cell to each row
- Append the rows to the table
- Append coffee table to new table table element
- Create a click event listener on the button and pass in the function