Add eventlistener to multiple elements to execute multiple functions

Question

I am trying to add an eventlistener to 2 objects but only get it to work with 1. There are 2 textinputs which both should execute 4 functions on input. The first is my working single element code. There are many topics that already cover this problem and have many answers but I cant figure it out. Below I have copied some of the answers that I tried.

//code 1
document.querySelector("#textinput1").addEventListener("input", function WriteText () {
        document.getElementById("displaytext").innerHTML = document.getElementById("textinput1").value;
    });

//Answer 1 /// In both answer 1 and 2 I have put my Function() insides into the eventlistener function///

let elementsArray = document.querySelectorAll("#textinput1, #textinput2");

elementsArray.forEach(function(elem) {
    elem.addEventListener("input", function() {

        document.getElementById("displaytext").innerHTML = document.getElementById("textinput1").value;

    });
});

//Answer2 // Tried it like this and putting the document.querryselector lines of both textinput directly between the []
    var Element1 = document.querySelector("#textinput1")
        var Element2 = document.querySelector("#textinput2")
    [Element1, Element2].forEach(function(element) {

   element.addEventListener("input", function() {
         document.getElementById("displaytext").innerHTML = document.getElementById("textinput1").value;

   });
});

Answer 1

The this keyword points to the the current elem object.

 let elementsArray = document.querySelectorAll("#textinput1, #textinput2");
 elementsArray.forEach(function (elem) {
  elem.addEventListener("input", function () {
  document.getElementById("displaytext").innerHTML = this.value;
  });
 });