Populate Several Select Dropdowns with single array

by Matthew Schenker

HTML

<div id="dropdown">
  <select name="field1">
    <option value=""></option>
  </select>
</div>
<div id="dropdown">
  <select name="field2">
    <option value=""></option>
  </select>
</div>
<div id="dropdown">
  <select name="field3">
    <option value=""></option>
  </select>
</div>
<div id="dropdown">
  <select name="field4">
    <option value=""></option>
  </select>
</div>

JavaScript

//NOTE: To add a PHP array, use the following syntax example in the first line:
// var workers = <?php echo json_encode($workers); ?>;
var people = ["Matthew", "John", "Nancy", "Steve", "Francis", "Barbara"];
for (var i = 0; i < people.length; i++) {
  //creates option tag
  jQuery('<option/>', {
    value: people[i],
    html: people[i]
  }).appendTo('#dropdown select'); //appends to select if parent div has id dropdown
  // Use the following option to populate the field with a specific value
  // $("#dropdown select").val("Steve");
}