Ok Thank you very much for your help, it works now, i had to stop the event propagating as said earlier, here is the new version :
$(document).click('.buttonVoirProduit',async()=>{
console.log('buttonVoirProduit Clicked');
/*console.log('buttonVoirProduitId Ooutside : ', buttonVoirProduitId);*/
console.log('buttonId : ', buttonVoirProduitId);
const divFicheProduit = document.createElement('div');
divFicheProduit.style.width = '100%';
divFicheProduit.style.height = '100%';
divFicheProduit.style.opacity = '80%';
divFicheProduit.style.background = 'black';
divFicheProduit.style.display = 'flex';
divFicheProduit.style.position = 'absolute';
divFicheProduit.style.left = '50%';
divFicheProduit.style.transform = `translateX(-50%)`;
divFicheProduit.style.top = '200px';
divFicheProduit.id = `ficheProduit${buttonVoirProduitId}`;
divFicheProduitId = divFicheProduit.id;
console.log(`divFicheProduitId after buttonVoirProduit clicked : `,divFicheProduitId);
const buttonLeave = document.createElement('img');
buttonLeave.src = 'icones/cancel.png';
buttonLeave.classList.add('buttonLeave');
buttonLeave.id = `buttonLeave${buttonVoirProduitId}`;
buttonLeave.style.right = '0px';
buttonLeave.style.top = '0px';
buttonLeave.style.cursor = 'pointer';
buttonLeave.style.zIndex = '1000';
buttonLeave.style.position = 'absolute';
buttonLeave.style.width = '25px';
buttonLeave.style.height = 'auto';
buttonLeave.style.aspectRatio = 'preserve';
buttonLeave.style.filter = 'brightness(0) saturate(100%) invert(92%) sepia(3%) saturate(2225%) hue-rotate(339deg) brightness(101%) contrast(91%)';
const imgFicheProduit = document.createElement('img');
imgFicheProduit.style.width = '50%';
/*divFicheProduit.style.zIndex = '1000';*/
divFicheProduit.append(buttonLeave);
document.body.appendChild(divFicheProduit);
buttonLeave.addEventListener('click', async(e) =>{
e.stopPropagation();
divFicheProduit.style.display = 'none';
});
});