Как удалить все элементы `input`, которые больше, чем тот, кто вызывает функцию?

Я пытаюсь удалить все элементы input, пока for loop не перехватит тот, который запускает функцию.

Проблемы, могу ли я использовать remove, чтобы удалить его из дома? вторая проблема: можно ли выбрать «класс», чтобы я мог удалить/удалить его? У всех одинаковые classname.

Я создаю новый INPUT и вставляю ID в ARRAY

function child_input(element) {
  if (order_input.length-1 == 2) {
    alert("ritch lenght")
    return false;
  }
  if (order_input.length-1 >= 2) {
    alert("Fail!!")
  }
  element = document.createElement('input');
  element.type = "number";
  element.classList.add('dropNew');
  element.id = "input"+counter+"";
  element.onmouseleave = function mouseLeave() {
    if (element.value != "") {
      element.readOnly = true;
      element.classList.add('unWriteable');
      element.onmouseleave = false;
      child_input();
      element.addEventListener('dblclick', function() {
        element.classList.remove('unWriteable');
        element.readOnly = false;
        element.onmouseleave = function() {
          //hier würde ich immer den input(child) vorigen löschen...
          mouseLeave();
          removeChild_input(this.id);
        }
      });
    }
  }
  document.querySelector('.Main_Div').append(element);
  order_input.push(element);
  counter++;
}

Это может быть немного сложно понять!! Если я сейчас dbclick один из этих четырех input (пример второй), я бы хотел, чтобы следующий ввод был удален. (номер 4,3 должен быть удален).

  //hold the oldest, and remove all child
    let delete_item = document.querySelector('#'+ id);
    let num_id = id.replace("input", " ");
    num_id = parseInt(num_id);

    for (var i = order_input.length-1; i >= num_id; i--) {
      order_input.slice(-1);
      order_input.pop();
      document.querySelector(".dropNew")[i].remove();
    }
    console.info(order_input.length-1);
}