これをベースとして使用できます。

<div class="FlightList">
   <select id="departureFlightsControl" onchange="addToInfo(this)">
        <option value="default" >No flight chosen</option>
        <option value="20121113 17:37:00">November 13, 2012 (5:37pm) - $137.38</option>
        <option value="20121119 05:11:00">November 19, 2012 (5:11am) - $121.05</option>
        <option value="20121124 19:41:00">November 24, 2012 (7:41pm) - $182.44</option>
        <option value="20121208 08:22:00">December 8, 2012 (8:22am) - $140.75</option>
    </select>
</div>
<div id="flightInformation">    

</div>
<script type="text/javascript">
function addToInfo(element){
    var opt = $(element).find(":selected").remove();
    var span = $('<span style="margin-left:20px;" onclick="addToList(this)">  X</span>');
    $(span).data('option', opt);
    var div = $('<div>'+$(opt).html()+'</div>')
    $(div).append(span);
    $('#flightInformation').append(div);
}

function addToList(element){
    $('#departureFlightsControl').append($(element).data('option'));
    $(element).closest('div').remove();
}
</script>

少なくともFirefoxでは問題なく動作するスクリプトを思いついた。Firefoxでの問題はchange、コントロールを離れるまで（そしておそらく他のブラウザでも）clickイベントが発生しないことでした。イベントは、選択を行うときだけでなく、ドロップダウンを引き出すときに発生します。これにより、同期が非常に難しくなり、実際のフライトが選択されるまで、「フライトが選択されていません」という項目がリストから削除されませんでした。

そこで、この問題について少し調べてから、選択したドロップダウンとロールアップを検出するための独自のjQueryプラグイン（jsFiddle）を作成しようとしました。それは良くなりますが、それでもFirefoxでは完全には機能しません。

私の結論は、そのような動物をほとんど機能させることはできますが、いくつかのことを回避することはできないということです。

• すべてのブラウザが同じように実装するわけではないため、「動作が異なる」方法が異なります。
• Firefoxでは、ドロップダウンされた選択コントロールを含むiframeをクリックすると、ドロップダウンがロールアップし、それに応答するためにできることは何もありません。そのため、コントロールを終了するか、ページの他の場所をクリックするまで、コードはしばらくの間間違ったイベントを報告します。
• さらに、FirefoxはjQueryライブラリでスクリプトエラーをスローしていましたが、Chromeではスローしていませんでした。
• Alt↓ドロップダウンを開くなどのキーボードショートカットを使用しても、少なくともFirefoxではマウスイベントはスローされません。したがって、キーボードイベントのトラップをさらに追加する必要があります（Mac、Android、iPhoneでこれを正しく実行できると確信していますか？）

注：そのフィドルのコードは最適ではなく、バグがあることを認識しています。これは放棄されたプロトタイプであり、完成品ではありません。:)

ですから、代わりにカスタム選択ボックスを使用することをお勧めします。これにより、ほとんどすべてのことを実行できます。これは、選択ボックスの置換jQueryプラグインの1つの例です。

ページの読み込み時にすべてのオプションをキャッシュするソリューションを次に示します。オプションが選択されると、オプションはキャッシュから、値が選択されたオプション以外のすべてのオプションに置き換えられます

var departSelect=$('#departureFlightsControl');
/* cache clones of all options*/
var departOptions=departSelect.find('option').clone();

departSelect.change(function(){
    var currVal=$(this).val();

    /* other display logic using currVal*/


    /* get new options that don't include current one selected from cache*/
    var newOptions= departOptions.clone().filter(function(){
        return $(this).val() ! = currVal;
    });

    $(this).html(newOptions)

})

これは、それをシンプルに保ち、仕事をする合理的な解決策です。必要に応じて、関数の特異性を明らかに高めることができます。

$(document).ready(function () {  
    var temp = 0;
    if ($(':selected')) {
        $('select').change(function () {
            if (temp !== 0) {
                temp.show();
            }
            temp = $(':selected').hide();
            return temp;
        });
    } else {
        ('select').show();
    }
 });