jquery binding to select changes
<p>I have a hidden select which should be automatically selected via a visible select, my jquery is:</p>

<pre><code>$(document).ready(function() {

    var selected_val = $('#id_foo option:selected').val();
    $('#id_bar').val(selected_val);

    $("#id_foo").change(function() {
        selected_val = $(this).attr('value');
        $('#id_bar').val(selected_val);
    });

});
</code></pre>

<p>This works fine, but the page I am working on has the option to add a value to the (visible) select on the fly. How do I bind to this event and add this to the hidden list before updating the selected value?</p>
