Ionut1

HTML

<input type="text" placeholder="Please input a number" id="noColors" />
<input type="text" placeholder="Delay" id="delay" />
<div id="display"></div>

CSS

#display {
    background-color:black;
    height:50px;
    margin:10px;
}

JavaScript

(function () {
    "use strict";
    var display = document.getElementById('display');
    var noColorsID = document.getElementById('noColors');
    var delayID = document.getElementById('delay');
    var delay;
    var intervalID;
    
    delayID.addEventListener("keyup", function(e){generateButtons(e)});
    noColorsID.addEventListener("keyup", function(e){generateButtons(e)});
    
    function generateButtons(e) {
        if (IsEnter(e)) {
            resetHomespace();
            var noColors = noColorsID.value;
            if (hasForbiddenCharacters(noColors, delay)) {
                alert("You entered either a number lower than zero or characters. \nPlease enter only numbers higher than zero");
                return;
            }
            var colors = [];
            colors = generateColors(noColors);
            addButtons(colors);
        }
    }
    
    function hasForbiddenCharacters(noColors, delay){
        if (noColors < 1 || isNaN(noColors) || delay < 1 || isNaN(delay)){
            return true;
        }
        return false;
    }
    
    function IsEnter(e){
      var key = e.which || e.keyCode;
      if (key == 13){
        return true;
      }
      return false;
    }

    function resetHomespace() {
        clearInterval(intervalID);
        counter = 0;
        delay = delayID.value;
        display.innerHTML = "";
    }

    function addButtons(colors) {
        intervalID = setInterval(function (colors) {
            console.log('iterating');
            if (colors.length) {
                var button = newBtnWithColor(colors[counter]);
                button.addEventListener("click", function(){ 
                    changeBGColorUsing(this);
                });
                display.appendChild(button);
                colors.shift();
            } else clearInterval(intervalID);
        }, delay, colors);
    }
    
    function changeBGColorUsing(btn){
        display.style.backgroundColor = "rgb(" + btn.innerHTML + ")";
   ...