I can console.log my '.span' element, as well as my '.header' element, but I can't attach an event listener to either. I am able to attach an event listener to my innerDiv (const c) though.
Ultimately, the .span would act as the way to remove the modal.
JSFiddle
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="shortcut icon" href="#">
<link rel='stylesheet' href='style.css'>
<script type="text/javascript" src="./index.js" defer></script>
</head>
<body>
<button id='test'>test</button>
</body>
</html>
function createModal(id, className, innerId, wrapName){
const div = document.createElement('div')
div.setAttribute('id', 'poem-header'+id)
div.classList = 'header'
const span = document.createElement('span')
span.classList = 'span'
span.innerHTML = 'X'
div.appendChild(span)
const c = document.createElement('div')
c.setAttribute('id', `${innerId}`)
c.classList = 'poem'
const wrap = document.createElement('div')
wrap.setAttribute('id', wrapName)
wrap.classList = 'wrap'
document.body.appendChild(wrap)
document.getElementById(`${wrapName}`).append(div, c)
document.querySelector('.span').addEventListener('click', function(){
console.log('working')
})
}
document.getElementById('test').addEventListener('click', ()=>{
document.getElementById('test').setAttribute('disabled', 'true')
createModal('-0', 'poem0', 'poem0', 'wrap0')
})
question from:
https://stackoverflow.com/questions/65854129/add-event-listener-not-attaching 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…