So, I am not all to versed in JavaScript so forgive me for what will probably be an easy answer. In JavaScript, not JQuery, I am trying to create a script to change an input boxes value with 2 buttons, up and down. That, works. The next step was to take the value and create multiple input buttons with the type="file". I have tried multiple versions of this but i cant seem to get it working right. Any input would be helpful..

<div id="groupConfig" class="row"></div>
<input type="number" class="number" id="groups" value="1" onchange="layersElement()">
<input type="button" value="down" class="button" id="selNumDown" onclick="selDown()">
<input type="button" value="up" class="button" id="selNumUp" onclick="selUp()"><br>

<div id="numGroups"></div>

const numGroups = document.getElementById("groupConfig");
const numSelected = document.getElementById("groups");

function selUp(){
    if((numSelected.value >= 1) && (numSelected.value < 10)) {
        numSelected.value++;
    }else{
        numSelected.value = 10;
    }
    numGroups.appendChild(numSelected);
}
function selDown(){
    if((numSelected.value <= 10) && (numSelected.value > 1)) {
        numSelected.value--;
    }else{
        numSelected.value = 1;
    }
    numGroups.appendChild(numSelected);
}

// THIS IS THE PART I NEED HELP WITH VVV

function layersElement() {
    let numLayerResult = document.getElementById("groups").value;

    const numLayers = document.getElementById("numGroups");

    for (let x = 1; x <= numLayerResult; x++) {
        const fileLayerGroups = document.createElement("input");
        fileLayerGroups.type = "file";
        fileLayerGroups.class = "file";

        let idNum;
        idNum = "Layer" + x;
        fileLayerGroups.id = idNum;

        numLayers.appendChild(fileLayerGroups);
    }
}