Eliminar el padre de un elemento con jQuery

Eliminar el padre de un elemento con jQuery

Eliminar el padre de un elemento con jQuery

En este tutorial aprenderemos cómo eliminar dinámicamente el padre de un elemento con jQuery.

En algunas ocasiones el elemento padre no tiene una id o clase única pero podemos identificarlo por alguno de sus hijos directos.

Veamos un ejemplo de un elemento section con dos hijos directos

<!--Elemento padre-->
<section>
  <!--Elementos hijos-->
  <h1 id="titulo">Título del libro</h1>
  <p>Contenido</p>
</section>

Si queremos eliminar el elemento section podemos seleccionarlo con jQuery y eliminarlo con la función remove(), pero si lo eliminamos directamente, esto puede afectar a otros elementos section de la página.

La solución que planteamos es la de seleccionar a uno de sus hijos y, desde ahí eliminar a su elemento padre de esta manera

<script>
  //Código jQuery
  //Eliminamos al padre del elemento con id=titulo
  $("#titulo").parent().remove();
</script>

Si te ha gustado no olvides compartir en redes sociales.

Espero que te haya servido. Cualquier duda deja un comentario. Un saludo

Dejar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Translate »
Ir a la barra de herramientas