Estoy tratando de crear un detector de eventos que use la solicitud PUT (Fetch) para cambiar un parámetro 'Archivo' a verdadero o falso cuando se hace clic en el ícono de fuente impresionante, sin embargo, no funciona (ni siquiera el registro de la consola se dispara).

¿Cómo puedo arreglar esto?

 //create function to confirm if email is archived (INBOX ONLY) function confirmArchiveStatus() { let archiveBtn = document.querySelector('.archive') //ADDeventlistener for click to archive button archiveBtn.addEventListener('click', function() { //just testing if this fired console.log('archived: true'); //use put request to mark email as achived fetch(`/emails/inbox/${id}`, { method: 'PUT', body: JSON.stringify({ archived: true, }) }) //Load inbox to refresh archived mails out load_mailbox('inbox'); }); archiveBtn.addEventListener('click', function() { console.log('archived: false'); //if archive is true, add event listener click to remove from archived mails if(email.archived != true) { fetch(`/emails/archive/${id}`, { method: 'PUT', body: JSON.stringify({ archived: false, }) }) } //Load inbox to refresh archived mails in load_mailbox('inbox'); }); }

ENLACE IMPRESIONANTE DE LA FUENTE

 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

HTML

 <div class="actions"> <span class="action archive"><i class="fa fa-archive"></i></span>