¿Cómo eliminar todo, excepto algunos elementos DOM en JQuery?

Question

Me gustaría eliminar todos los elementos ocultos en una pieza del DOM, pero conservando todos los elementos ocultos incluidos en cierta clase.

Aquí tienes una lista (no) working example:

<div id="init"> 
    <input type="hidden" name="x" value="y" /> 
    <ul> 
     <li>Hello</li> 
     <li>Bye</li> 
     <li class="block"> 
      <ol> 
       <li>First</li> 
       <li>Second</li> 
       <li>Third</li> 
      </ol> 
     </li> 
     <li>Test</li> 
    </ul> 
</div> 

CSS: li { "display:none" }

lo tanto, estoy buscando el selector que elimina todos los elementos ocultos, excepto los que tienen una clase de bloque o están bajo una clase de bloque. En este caso, el resultado esperado es:

<div id="init"> 
    <ul> 
     <li class="block"> 
      <ol> 
       <li>First</li> 
       <li>Second</li> 
       <li>Third</li> 
      </ol> 
     </li> 
    </ul> 
</div> 

He estado jugando con: not operator, pero no success.

Answer 1

Te refieres a esto?

$(':hidden').not('.block, .block *').remove(); 

alternativa:

$(':hidden:not(.block, .block *)').remove(); 

Pero $.fn.not() es una little more reliable than :not()

Answer 2

Usted puede simplemente utilizar CSS:

li.block, li.block li { display: block } 

Example

---

o más completa

li.block, li.block>* * { display: block }