WDV321 Advanced JavaScript

Dynamic Content - Drop Down Lists

The goals of this assignment:

  1. Demonstrate how to dynamically populate a select element using the document.write() technique
  2. Demonstrate how to dynamically populate a select element using the createElement() technique
  3. Demonstrate how to dynamically add an option to a select element
  4. Demonstrate how to dynamically change the options of a select element

Team Names


Team Name:

Instructions (implemented):

  1. Uses document.write() and the teamNames array to populate the select.
  2. On selection, displays the chosen team next to “Team Name:”.
  3. “Add Team Name” appends the typed value to the select.
  4. “Reset” restores original values.

Cookies or Candy?


Selected Product:


Instructions (implemented):

  1. Uses the createElement() technique + cookies array to populate productDisplay.
  2. On selection, displays the product next to “Selected Product:”.
  3. Radio buttons switch the select’s contents between cookies and candy.
  4. “Reset” (on the left) also restores this panel to its original state.