Dynamic Grocery List

The Method:

I started by creating an HTML framework to hold the input textbox as well as the other text. The "list" was its own div where I could have the text array appear.

After the HTML framework was in place I started working on the JavaScript. I made a function to capture the text from the textbox and added script to include a "plus mark" to each item in the Ingredients List.

Once Ingredients are in the Ingredients List they are added to the Shopping list with another JavaScript funtion.

Unexpected Challenges:

The hardest thing for me was keeping this project simple. I had so many ideas about what I wanted to do with it. In the end there were several ideas that were scrapped that ended up with some "dirty code". I learned that it's important to have a detailed plan before ever starting to code.

---