[JQuery] Eliminar elemento padre

[metacortex]

En este código necesito eliminar el elemento "<li>" completo cuando se pulse el botón Eliminar. Sólo deseo quitar los que tengan el checkbox activado:

Código HTML:

<ul id="contenedor">
    <li class="lista" id="lista-1">
        Lista 1
        <input type="checkbox" class="check" id="eliminar-1" />
    </li>
    <li class="lista" id="lista-2">
        Lista 1
        <input type="checkbox" class="check" id="eliminar-2" />
    </li>
    <li class="lista" id="lista-3">
        Lista 1
        <input type="checkbox" class="check" id="eliminar-3" />
    </li>
</ul>
 
<input type="button" id="eliminar" value="eliminar" />
 

A fin de lograrlo estoy intentándolo con la función .remove():

Código Javascript:

<script type="text/javascript">
$(function() {
    $("#eliminar").click(function () {
      $('.check:checked').remove(); 
    });
});
</script>
 

Actualmente sólo consigo eliminar el checkbox, pero no el padre de .check (la lista), el cual es el que me interesa quitar ¿Cómo le hago?.

Si desean ver el código en funcionamiento, por favor diríjanse aquí: http://jsfiddle.net/darioferrer/z5JGT/

[masterpuppet]

Probaste con parent ?

Código Javascript:

$(function() {
    $("#eliminar").click(function () {
        $('.check:checked').parent().remove(); 
    });
});
 

Saludos.

[metacortex]

Ja! Estuve intentándolo anoche pero no de esa forma jeje. Ya lo pruebo, gracias masterpuppet.

[metacortex]

¡Genial! Funciona perfecto, gracias viejo!.

Un aspecto que me llamó la atención sobre .remove() ha sido un comentario formulado en la documentación. El usuario afirma que para que la eliminación vía DOM sea íntegra, es mejor usar .empty().remove() que el simple .remove() ¿Qué opinan de eso?. El enlace al comentario:

http://api.jquery.com/remove/#comment-41237758

Hasta dicen que resulta más rápido.

[masterpuppet]

Ese thousand's se lo invento, la diferencia entre uno y otro a la hora de eliminar es :

remove

Código Javascript:

if ( elem.parentNode ) {
    elem.parentNode.removeChild( elem );
}
 

empty

Código Javascript:

while ( elem.firstChild ) {
    elem.removeChild( elem.firstChild );
}
 

Lo probé en local y va mas rápido remove, lo que si es verdad es que empty.remove es mas rápido que empty, habría que ver bajo que condiciones hizo el test, cantidad de nodos, nivel de nodos anidados, eventos y data guardados en los nodos y si al remove le paso un selector, sea cual sea el caso para notar diferencia tenes que tener cientos de nodos, en una situación normal es imperceptible.

Saludos.

[metacortex]

Iniciado por masterpuppet

Ese thousand's se lo invento

A mi su ejemplo me pareció demasiado desquiciado. Un caso inaplicable de cabo a rabo.

Iniciado por masterpuppet

habría que ver bajo que condiciones hizo el test

Hasta dejó un archivo descargable. Pesa como 3 MB jejeje.