Lien de suppression d'élément en JavaScript

Supposons que nous ayons un paragraphe. Créons à côté de lui un lien permettant de supprimer ce paragraphe.

Mettons en œuvre :

<div id="parent">
	<p id="elem">text</p>
	<a href="#" id="remove">remove</a>
</div>

let elem   = document.querySelector('#elem');
let remove = document.querySelector('#remove');

remove.addEventListener('click', function() {
	elem.remove();
});

Notez que l'attribut href du lien contient un #. Si vous retirez ce dièse - nous obtiendrons une navigation via le lien et, par conséquent, un rechargement de la page.

En réalité, la suppression du paragraphe aura bien lieu également, mais nous ne le remarquerons pas, car la page se rechargera et tout reviendra à son état initial.

Pour résoudre le problème, il faut empêcher la navigation via le lien en utilisant preventDefault :

<div id="parent">
	<p id="elem">text</p>
	<a href="" id="remove">remove</a>
</div>

let elem   = document.querySelector('#elem');
let remove = document.querySelector('#remove');

remove.addEventListener('click', function(event) {
	elem.remove();
	event.preventDefault(); // annule la navigation via le lien
});

Indépendamment, sans regarder mon code, résolvez le problème décrit.