2

Buen día compañer@s coders, estoy teniendo problema con una lista html (ul), que esta contiene elementos li, lo que quiero realizar es ocultar todos los elementos li de esa lista ul exceptuando un li que contiene un id, para esto lo podremos realizar con la ayuda de jquery o de javascript, pero no entiendo cómo realizarlo si algun@ me puede ayudar o aconsejar de cómo resolver el problema lo agradecería muchísimo.

La lista ul es la del id "rFe3", y deseo ocultar todos los li dentro de esta lista exceptuando el li que contiene el id "infoCursos".

<ul id="rFe3" class="nMods flist">
                <li>
                    <label> <input type="checkbox" name="tot" value="T" class="ios-switch">
                        <div class="switch"></div> Totales
                    </label>
                </li>
                <li>
                    <label> <input type="checkbox" name="reg" value="R" class="ios-switch">
                        <div class="switch"></div> Registrados
                    </label>
                </li>
                <li>
                    <label> <input type="checkbox" name="ing" value="I" class="ios-switch">
                        <div class="switch"></div> Ingresos
                    </label>
                </li>
                <li>
                    <label> <input type="checkbox" name="eva" value="E" class="ios-switch">
                        <div class="switch"></div> Evaluaciones
                    </label>
                </li>
                <li id="infoCursos">
                    <label> <input type="checkbox" name="infoCursos" value="IC" class="ios-switch">
                        <div class="switch"></div> Información Cursos
                    </label>
                </li>
            </ul>

Nota: No le puedo colocar id a los li que no lo tienen ya que este contenido podrá variar con el tiempo y no lo veo viable cada vez que se agregue una nueva opción agregar un id nuevo.

2 respuestas 2

5

Agregas una clase y en css los ocultas con esa clase, cada vez que agregues un elemento, le agregas la clase si lo quieres agregar oculto. Con un bucle puedes asignarle la clase para ocultar y con un if condicionar que si el elemento tiene id infoCursos entonces no le agregue la clase.

1

Otra alternativa puede ser con css sin necesidad de añadir nada más.

li:not(#infoCursos) {
    display: none;
}

En caso de que sólo quieras que afecte a los li de la lista:

#rFe3 li:not(#infoCursos) {
    display: none;
}
1
  • Muchas gracias por el aporte. el 22 sep. 2022 a las 14:34

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.