Remove a dropdown value that has been selected from another dropdown menu

Question

I have searching the web for a while and still I cant find an answer, I have three drop-down menus on my site.

I use them for accepting user preferences so the user can control the output of results.

So I want to know if its possible for the value to be taken out of the other 2 dropdowns if its selected in one.

for example if the user selects movies in the first one it wont be in the others.

here is my dropdowns

<select id="pref1select">
<option value="P">Preference One</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref2select">
<option value="P">Preference Two</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref3select">
<option value="P">Preference Three</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>

Answer 1

This will disable it, but not remove it.
Fiddle: http://jsfiddle.net/p2SFA/1/

HTML: (Added .preferenceSelect class) and jQuery:

 $(document).ready(function() {
        $(".preferenceSelect").change(function() {
            // Get the selected value
            var selected = $("option:selected", $(this)).val();
            // Get the ID of this element
            var thisID = $(this).prop("id");
            // Reset so all values are showing:
            $(".preferenceSelect option").each(function() {
                $(this).prop("disabled", false);
            });
            $(".preferenceSelect").each(function() {
                if ($(this).prop("id") != thisID) {
                    $("option[value='" + selected + "']", $(this)).prop("disabled", true);
                }
            });

        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<select id="pref1select" class="preferenceSelect">
	    <option value="P">Preference One</option>
	    <option value="M">Movie</option>
	    <option value="T">Tv</option>
	    <option value="G">Games</option>
	</select>
	<select id="pref2select" class="preferenceSelect">
	    <option value="P">Preference Two</option>
	    <option value="M">Movie</option>
	    <option value="T">Tv</option>
	    <option value="G">Games</option>
	</select>
	<select id="pref3select" class="preferenceSelect">
	    <option value="P">Preference Three</option>
	    <option value="M">Movie</option>
	    <option value="T">Tv</option>
	    <option value="G">Games</option>
	</select>

If you want it removed, you will probably have to make jQuery know what to insert when it has reset because a new choice is made :)