Desaparece un select desplegable al hacerle click

[mensajeescrito]

Hola amigos/as, verán tengo un pequeño problema.

Tengo el siguiente código que digamos que casi funciona. Lo que hace es que haciendo click en el botón "Menu" me aparece, mediante un fadeIn, un "select desplegable" con una serie de opciones a elegir en el desplegable en cuestión que aparece.

Pero el problema viene cuando en dicho desplegable intento hacerle click para que se despliegue la lista que lleva y automáticamente desaparece el select desplegable .
Y no se por que pasa esto.

Y es mas intento hacer click de nuevo en el botón "Menu" para que me aparezca de nuevo el select desplegable y ya no aparece.

Si alguien pudiera ayudarme le estaría muy agradecido.

Este es el código, gracias de antemano.

Código Javascript:

// inicialmente aparece la primera opcion marcada
        var ultimo=0+"_comida";
        $(document).ready(function(){
 
                $(".opcs_comidas div").click(function(){        
                // obtenemos el nuevo id
                nuevo=$(this).attr("id");
                if(nuevo!=ultimo)
                {
                    // escondemos el ultimo id
                    $("#opc_"+ultimo).fadeOut(function(){
                        $("#"+ultimo).removeClass("seleccionado");
                        $("#"+nuevo).addClass("seleccionado");
                        // mostramos el nuevo id
                        $("#opc_"+nuevo).fadeIn();
                        ultimo=nuevo;
                    });
                }
                });
        });
 

Código CSS:

.contenido {display:none;}
 

Código HTML:

<div class="opcs_comidas">    
    
    <div id="0_comida"><a href="#">Sin Menu</a></div>     
    
    <div id="1_comida"><a href="#">Menu</a></div> 
    
    
    
    
    
    <div id="opc_0_comida" class="seleccionado"></div>    
 
    <div id="opc_1_comida" class="contenido">    
                                        
        <select name="combo_comidas" id="combo_comidas" class="estilos_combo_comidas" title="Eliga su comida" required>
                                                                                                        
            <option value="">Elija su menu</option>
            <option value="Carne">Carne</option>
            <option value="Pasta">Pasta</option>
            <option value="Pescado">Pescado</option>
            
        </select>
                                      
    </div> 
    
</div>
 

[andresgarciadev]

es por que en el jquery estas usando

Código Javascript:

$(".opcs_comidas div").click(function(){
 

en lo cual indicas que al apretar cualquier div dentro... lo cual tambien contaria al dar click al select... cuenta como seleccionas al padre

Código HTML:

<div id="opc_1_comida" class="contenido">
 

por lo tanto lo que tienes q hacer es ser mas especifico... indicarle que solo se active al darle a los dos primer div por si id.... asi
http://jsfiddle.net/JTUj5/

[mensajeescrito]

Muchisimas gracias por sesolverme la duda, no solo me la has resuelto sino que ademas he aprendido con ello.

No te imaginas lo que te lo agradezco. Mil gracias fenomeno!!!!