Estoy tratando de eliminar todos los divs presentes con class='characterCard' , dentro de otro div con class='childContainer' , cuando se presiona un botón. .remove() y removeChild() también, pero no funciona. En cambio, cuando uso .removeChild() , aparece el siguiente error: No se pudo ejecutar 'removeChild' en 'Nodo': el nodo que se eliminará no es un elemento secundario de este nodo.
Las tarjetas de personaje se colocan dentro de los childContainers, por lo que el elemento principal es childDiv
let childDiv = document.querySelector('.childContainer'); let charDiv = document.querySelector('.characterCard'); searchBtn.addEventListener('click', ()=> { childDiv.removeChild(charDiv); })Llamar a remove en el niño:
let childDiv = document.querySelector('.childContainer'); let charDiv = document.querySelector('.characterCard'); searchBtn.addEventListener('click', ()=> { charDiv.remove(); })Debido a que (probablemente) hay más de un .characterCard , debe recorrer todos los elementos coincidentes dentro de .childDiv y eliminar uno por uno.
childDiv.querySelectorAll('.characterCard').forEach(el => el.remove()) let childDiv = document.querySelector('.childContainer'); searchBtn.addEventListener('click', ()=> { childDiv.querySelectorAll('.characterCard').forEach(el => el.remove()) })