sync select list with custom dropdown placeholder
<p>I have a custom dropdown with an underlying select list. It works like Amazon's search scope selector. Currently I 'sync' the custom dropdown with the select list like this:<br />
(prev() is the custom element)</p>

<pre><code>var $select = $('select');
$select.each(function(index, value) {
  var newValue = $(this).find('option:selected').text();
  $(this).prev().text(newValue);
});

$('select').change(function() {
  var newValue = $(this).find('option:selected').text();
  $(this).prev().text(newValue);
});
</code></pre>

<p>The code works fine and takes care of presetting the custom dropdown element on page load and on change(). However, I would like to learn how to do this in a better way - can I for instance maintain the sync using on() somehow? </p>
