title: Changing drop down list data on-the-fly
body: <p>I have a select box with a number of options. When a selection is made, I replace the displayed text using JQuery:</p>
  
  <pre><code>$("#dropdownlist").change(function () {
      var selected = $(this).find(":selected");
      selected.text('foo');
  });
  </code></pre>
  
  <p>I'd then like to restore the original value when the select is dropped down. How can I do this?</p>
  
  <p>I've tried using the 'click' event but this gets fired multiple times throughout the selection process, meaning that 'foo' always gets overwritten.</p>
  
  <p>Thanks in advance.</p>