#slideSource {
opacity: 1;
transition: opacity 1s;
}
#slideSource.fade {
opacity: 0;
}
var slideSource = document.getElementById('slideSource');
document.getElementById('handle').onclick = function () {
slideSource.classList.toggle('fade');
}
const target = document.getElementById("target");
target.addEventListener('click', () => target.style.opacity = '0');
// If you want to remove it from the page after the fadeout
target.addEventListener('transitionend', () => target.remove());
<button id="handle">Fade</button>
<div id="slideSource">Whatever you want here - images or text</div>
Run code snippet