正在制作一个Etch-a-Sketch项目，当我单击黑色按钮时，它可以工作。悬停时方块的背景颜色变为黑色。但是当我点击彩虹按钮时它不起作用。它应该在悬停时将正方形的背景颜色更改为随机颜色。

这是HTML：

<button id="black" class="btn" onclick="changeColor('black')"> <span> Black</span> </button>
<button id="rainbow" class="btn" onclick="changeColor('random')"> <span> Rainbow</span></button>

这是JS：

 let color = "black";

      function getColor(){
        if(true){
          if(color === "random"){
            let value = "0123456789ABCDEF";
        var random = "#";
        for (let i = 0; i < 6; i++){
          color += value[Math.floor(Math.random() * 16)];
        }
        this.style.backgroundColor = random;
          } else{
            this.style.backgroundColor = color;
          }
        }
      }

      function changeColor(select){
        color = select;
      }

该getColor()函数在getGrid(size)函数中调用。像这样：square.addEventListener("mouseover", getColor);

这是小提琴：https ://jsfiddle.net/JaredDev/w2kgubLq/6/

我应该怎么做才能使彩虹按钮在悬停时为正方形/像素生成随机背景颜色？