Quiero eliminar el resultado anterior de una consulta a una API de Spotify y que se quede la nueva consulta, el código que imprime la consulta en el DOM es este:
export function mostrarInfo(albumes){
albumes.forEach(info => {
if(info.album_type === 'album'){
const infoArtista = {
nombre: info.name,
fecha: info.release_date,
tracks: info.total_tracks,
foto: info.images[0]
}
const div = document.createElement('div');
div.classList.add('col-4');
div.classList.add('mb-5');
div.innerHTML = `
<div class="card_group">
<div class="card">
<img src="${infoArtista.foto.url}" class="card-img-top img-fluid">
<h2 class="titulo ml-2">${infoArtista.nombre}</h2>
<h4 class="ml-2">Tracks: ${infoArtista.tracks}</h4>
<p class="ml-2">Fecha de lanzamiento: <span class="badge badge-pill badge-warning">${infoArtista.fecha}</span>
</p>
</div>
</div>
`;
artistaContenido.appendChild(div);
}
})
}
Y el código donde quiero eliminar el resultado anterior es este:
const resultado = document.querySelector('#artista_preferido_resultado div');
if(resultado !== null){
resultado.remove();
}
Con esto solo se elimina el primer div de la primera consulta e imprime el resultado de la segunda.
const div = document.createElement('div');
a un select de un div existente así lo imprime siempre en el mismo div