I'm a beginner coder. Could someone help me make it so that when I press on an exit link the html that I injected before disappears?
const btnif = document.querySelector("#ytif");
const ifpss = document.querySelector(".ifpss");
btnif.addEventListener('click', () => {
ifpss.innerHTML = `<div class="ytifrore"><div class="ytiframe"><div
id="closep"> ×
Fermer la page </div><iframe class="ytifr" width="1280"
height="720"
src="https://www.youtube.com/embed/KMPkI"
title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard - write;
encrypted - media; gyroscope;
picture - in -picture " allowfullscreen></iframe></div></div>`;
})
<div class="ifpss"></div>
<a href="#" id="ytif" class="watch-more buttontext">
<p>Voir la vidéo de présentation →</p>
</a>
Something like
var myobj = document.getElementById("demo");
myobj.remove();
could help
Have a look at https://www.w3schools.com there are good examples for beginners
Why not just put your link inside the target div? Then it'll be naturally overwritten by your existing code.
const btnif = document.querySelector("#ytif");
const ifpss = document.querySelector(".ifpss");
btnif.addEventListener('click', () => {
ifpss.innerHTML = `<div class="ytifrore"><div class="ytiframe"><div
id="closep"> ×
Fermer la page </div><iframe class="ytifr" width="1280"
height="720"
src="https://www.youtube.com/embed/KMPkI"
title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard - write;
encrypted - media; gyroscope;
picture - in -picture " allowfullscreen></iframe></div></div>`;
})
<div class="ifpss">
<a href="#" id="ytif" class="watch-more buttontext">
<p>Voir la vidéo de présentation →</p>
</a>
</div>
Just add <a href="#" onclick="ifpss.innerHTML=''"> to make the text a link that deletes the ifpss html.
const btnif = document.querySelector("#ytif");
const ifpss = document.querySelector(".ifpss");
btnif.addEventListener('click', () => {
ifpss.innerHTML = `<div class="ytifrore"><div class="ytiframe"><div
id="closep"> <a href="#" onclick="ifpss.innerHTML=''">×
Fermer la page</a> </div><iframe class="ytifr" width="1280"
height="720"
src="https://www.youtube.com/embed/KMPkI"
title="YouTube video
player" frameborder="0" allow="accelerometer; autoplay; clipboard - write;
encrypted - media; gyroscope;
picture - in -picture " allowfullscreen></iframe></div></div>`;
})
<div class="ifpss"></div>
<a href="#" id="ytif" class="watch-more buttontext">
<p>Voir la vidéo de présentation →</p>
</a>