Ввод значений в динамически генерируемые типы ввода с помощью JavaScript

У меня есть входы типа Range/Number, которые синхронизированы и динамически генерируют поля ввода так же, как и их значения.

Затем у меня есть кнопка, которая заполнит сгенерированные поля ввода произвольным значением.

Каждое из динамически сгенерированных полей ввода имеет уникальные идентификаторы, но функция document.getElementById() не может найти ни один из идентификаторов и возвращает значение null.

Есть ли способ изменить значение сгенерированных полей в функции randomizeItemTypes()?

function randomizeItemTypes(textbox) {
  var rackNum = textbox.replace("itemSlider", "").replace("numOfTypes", "");
  var numOfTypes = document.getElementById("numOfTypes1").value;
  for (var i = 0; i < numOfTypes; i++) {
    document.getElementById("rack" + rackNum + "." + i).value = 4;
  }
}

Следующая ссылка — это CodePen для моего кода: http://codepen.io/cnc4ever/pen/LGNMEp