JQUERY Auto hide a SELECT LIST if it contains a specific value
<pre><code>&lt;select name="productsize" id="productsize"&gt;
    &lt;option value=""&gt;1&lt;/option&gt;
    &lt;option value=""&gt;xxx&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>How with jQuery to Hide this SELECT list if it contains "xxx" as one of the options?</p>

<p>Is it possible? </p>

<h2>UPDATE:</h2>

<p>The above is jast an example, ROB answered to it, and it really working. But in my situation this select list is generated first of all by another jquery function.</p>

<p>this is it:</p>

<pre><code>&lt;script type="text/javascript"&gt;&lt;!--
function GetAvailProductSizes() {
    $('select#productsize option').remove();
    $('select#productsize').append('&lt;option value=""&gt;&lt;? echo $langdata['oneprodpage_selectsize']; ?&gt;...&lt;/option&gt;');

    var color = $('#productcolor').val();
    if (color &gt; 0) {
        var availsizes;
        var http_request = new XMLHttpRequest();
        http_request.open( "GET", '&lt;? echo ROOT; ?&gt;/autocompleteavailsizes/?productid=&lt;? echo $thisproduct['id']; ?&gt;&amp;color=' + color, true );
        http_request.send(null);
        http_request.onreadystatechange = function () {
            if ( http_request.readyState == 4 ) {
                if ( http_request.status == 200 ) {
                    availsizes = eval( "(" + http_request.responseText + ")" );
                    $('select#productsize').show();

                    for (var i = 0; i &lt; availsizes.length; i++) {
                        $('select#productsize').append('&lt;option value="' + availsizes[i].id + '"&gt;' + availsizes[i].name + '&lt;/option&gt;');
                    };
                } else {
                    alert( "There was a problem with the URL." );
                }
                http_request = null;
            }
        };
    };
}
</code></pre>

<p>//-->
</p>

<p>I tryied this:</p>

<pre><code>&lt;script type="text/javascript"&gt;&lt;!--
function GetAvailProductSizes() {
    $('select#productsize option').remove();
    $('select#productsize').append('&lt;option value=""&gt;&lt;? echo $langdata['oneprodpage_selectsize']; ?&gt;...&lt;/option&gt;');

    var color = $('#productcolor').val();
    if (color &gt; 0) {
        var availsizes;
        var http_request = new XMLHttpRequest();
        http_request.open( "GET", '&lt;? echo ROOT; ?&gt;/autocompleteavailsizes/?productid=&lt;? echo $thisproduct['id']; ?&gt;&amp;color=' + color, true );
        http_request.send(null);
        http_request.onreadystatechange = function () {
            if ( http_request.readyState == 4 ) {
                if ( http_request.status == 200 ) {
                    availsizes = eval( "(" + http_request.responseText + ")" );
                    $('select#productsize').show();
                    $('select#productsize option').each(function() {
                        if ($(this).text() == '-') {
                            $('select#productsize').hide();
                        }
                    });
                    for (var i = 0; i &lt; availsizes.length; i++) {
                        $('select#productsize').append('&lt;option value="' + availsizes[i].id + '"&gt;' + availsizes[i].name + '&lt;/option&gt;');
                    };
                } else {
                    alert( "There was a problem with the URL." );
                }
                http_request = null;
            }
        };
    };
}
</code></pre>

<p>//-->
</p>

<p>but its not working...</p>

<p>Oh yeah and my select list has style <strong>display: none</strong></p>
