I need to read the values from inputs that I'm creating dynamically on the DOM.

When I click submit I need to obtain all the inputs, I do it with an event to a querySelectorAll but I need this last one to be outside the evenListener click because otherwise each time I press "submit" I get all the inputs again and repeat everything in my instance of object, where every input goes.

How can I get all the inputs information just once and not adding more repeat instances of the object in each submit?

 let containerTasks = [];


const btnAddTask = document.getElementById("button-addon2");

const submitBtn = document.getElementById("btn__submitList");



class Tasks {
    constructor(name, index) {
        this.name = name;
        this.index = index;
    }
}


const myForm = document.createElement("form")
const myInputForms = myForm.setAttribute('class', 'my-InputForms');
mainTaskList.append(myForm)

btnAddTask.addEventListener("click", () => {


    inputSlot = document.createElement('input');
    inputSlot.setAttribute('type', 'text');
    inputSlot.setAttribute('placeholder', 'Ingresa tu tarea');
    inputSlot.setAttribute('class', 'input-forms');

    myForm.appendChild(inputSlot);


    let inputSubmit = document.createElement('input');
    inputSubmit.setAttribute('type', 'submit');
    inputSubmit.setAttribute('class', 'sending');
    myForm.appendChild(inputSubmit);



})


const myInput = document.querySelectorAll('.input-forms');


myForm.addEventListener("submit", (e) => {
    e.preventDefault();

    myInput.forEach((myTask, index) => {
        containerTasks.push(new Tasks(myTask.value, `tarea ${index}`));
    })


    console.log(containerTasks)


});