Bonjour, je n'arrive pas à comprendre pourquoi je n'arrive pas à récupérer la bonne valeur de ma variable btnAbsent ?

Voir ligne 13 et 17
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
// LE MODAL EST APPELE EN ATTRIBUANT DATA-TOGGLE ET DATA-TARGET A CHAQUE BOUTON
var btnAbsents = document.getElementsByClassName('Absent');     
var select = document.querySelector('.custom-select'); 
 
btnAbsents.forEach(function(btnAbsent){
 
 btnAbsent.setAttribute('data-toggle', 'modal'); 
 btnAbsent.setAttribute('data-target', '#modalAbsent');
 
 btnAbsent.addEventListener('click', function(){
 
  label = btnAbsent.nextElementSibling; 
  console.log(btnAbsent); // --> je récupère bien mon ELEMENT HTML en fonction du click (ELT 1 - ELT 2 - ELT 3 ..... ok)
 
  select.addEventListener("change", function(e){
 
   console.log(btnAbsent); // --> je récupère systématiquement et uniquement mon ELEMENT HTML 1 quel que soit le click sur les btnAbsent (Elt1 - Elt1 - Elt 1....) alors que je pensais récupérer (ELT 1 - ELT 2 - ELT 3) en fonction du click
   btnAbsent.value = motifAbsence;   
 
   var motifAbsence = select.value;
   label.innerHTML = (' Absent : ' + motifAbsence); 
 
   $('#modalAbsent').modal('hide');
   e.stopImmediatePropagation();
  })
 })
});
Si vous aviez une explication et une solution. Merci d'avance