Jquery: Ocultar todos los elementos secundarios, luego mostrar un elemento específico

Question

Quiero ocultar todos los elementos secundarios en un div. Y luego muestre uno específico transferido a la función.

function subDisplay(name) { 
    $("#navSub").each(function() { 
     $(this).hide(); 
    }); 
    $(name).show(); 
} 

entonces llama a la función de un evento onmouse como: subDisplay(#DivIwantToShow); Pero no se muestra nada ...

¿Qué estoy haciendo mal?

Answer 1

Necesita ocultar los elementos secundarios y no los elementos que contienen div.

$("#navSub").children().hide();

Así que ahora si el div que está tratando de mostrar es un elemento en el div padre seguirá mostrando mientras que los otros permanecen ocultos.

Answer 2

function subDisplay(name) { 
    $("#navSub").hide(); 
    $('#'+name).show(); 
} 

Answer 3

trate de hacer que fuera del bucle, así:

function subDisplay(name) { 

    $("#navSub").hide(); 

    $(name).show(); 
} 

http://jsfiddle.net/peduarte/m2pj8/

Answer 4

para resumir los grandes comentarios de @dotweb y @ Matt;

function subDisplay(name) { 
    $('#navSub').hide(); 
    $(name).show(); 
} 

subDisplay('#DivIwantToShow'); 

Answer 5

Si usted está apuntando a los hijos de #navSub, es necesario dirigirse a ellos y ocultar ellos, en lugar del elemento de navSub; que puedes hacer usando el método children();

function subDisplay(name) { 
    $('#navSub').children().hide(); 
    $(name).show(); 
}; 

De lo contrario, parece que tienes múltiples elementos con el mismo ID en su DOM, que no está permitido.

Luego debe pasar una cadena (que es un selector jQuery válido) a subDisplay();

subDisplay('#DivIwantToShow'); 

Answer 6

si el nombre del elemento se pasa en el uso de este nombre:

if($(this).attr('name') != name){ 
    //Hide it 
    } else { 
    //show it 
}