jQuery: Seleccionar todos los elementos que no son descendiente de una determinada clase

Question

<div class="container" id = "0" > 
    <div class="x" id = "1"> 
     <div id = "2"> 
     <p id = "3"> 
      <span id = "4" >text</span> 
     </p> 
     <div> 
    </div> 

    <div id="5"> 
     <div id="6"> 
     <p id="7"> 
      <span class="x" id="8" >text</span> 
      <span id="9">text</span> 
     </p> 
     <div> 
    </div> 
<div> 

¿Me pueden ayudar a seleccionar todos los elementos:

• que son descendiente de' .container "'
• no descendiente de '.x'
• no tiene la clase '.x' en sí.

---

Mirando el HTML de arriba; debe seleccionar los elementos 5,6,7 y 9

• elemento 1 tiene clase "X"
• Elementos 2 es hijo directo de una "X" elemento-con-clase (Elemento 1)
• elementos 3 y 4 son descendientes una "X" elemento-con-clase (elemento 1)

elemento 8 tiene clase "X"

---

tengo este selector pero sigue seleccionar los descendientes (hijos de profundidad) del elemento con la clase "X"

var elements = $('.container').find().parents(':not(.X)').andSelf().filter(':not(.X)'); 

Answer 1

Esto debe hacerlo:

$('.container').find(':not(.x):not(.x *)'); 

Editar: vuelto a la primera revisión de nuevo. Pensé que no funcionaba de esta manera, pero tienes un error en tu HTML que hace que #1 sea el padre de todos los elementos, por lo que ninguno está seleccionado.

<div class="container" id = "0" > 
    <div class="x" id = "1"> 
     <div id = "2"> 
     <p id = "3"> 
      <span id = "4" >text</span> 
     </p> 
     <div> <!-- <-- must be a closing div tag --> 
    </div> 

    <div id="5"> 
     <div id="6"> 
     <p id="7"> 
      <span class="x" id="8" >text</span> 
      <span id="9">text</span> 
     </p> 
     <div> <!-- <-- must be a closing div tag --> 
    </div> 
<div> <!-- <-- must be a closing div tag --> 

Answer 2

utilizando comodines o bien

$(".container :not(* .x)") 

o

$(":not(* .x)", ".container") 

pueden trabajar.