6个div块,随机颜色

参加工作以后，基本用到的都是react，最近老大要求用h5+mui做出一款app,制作过程中发现很多原生js已经不熟悉，看来js基础忘得都差不多了，需要补习了。app中有一个要求是页面对应的几个模块每次打开都要显示不同的随机颜色。我就封装成了一个函数，有不足的地方，还希望多多指点。代码如下。

    

<div class="giveYouColorSeeSee">1</div>
<div class="giveYouColorSeeSee">2</div>
<div class="giveYouColorSeeSee">3</div>
<div class="giveYouColorSeeSee">4</div>
<div class="giveYouColorSeeSee">5</div>
<div class="giveYouColorSeeSee">6</div>

.giveYouColorSeeSee {
	width: 100px;
	height: 100px;
	border: 1px solid blue;
	display: inline-block;
	margin-top: 10px;
	margin-right: 10px;
}				

<script>
var giveColor = document.getElementsByClassName('giveYouColorSeeSee');
var color = ['#578fff', '#8c9ffd', '#ff7ea2', '#ffbf43', '#74dde3', 'red'];
function randomColorOn(giveColor,color){//参数1为获取的元素组，参数二为获取的颜色组
	var arr2 = [];
	for(var i = color.length; i > 0; i--) {
		const num = Math.floor(Math.random() * color.length); //获取随机数
		arr2.push(color[num]); //把随机数添加到数组中
		color.splice(num, 1); //删除原有数组的颜色
	}
				 
	for(var j = 0; j < giveColor.length; j++) {
		giveColor[j].style.backgroundColor = arr2[j];
		}
	}
	randomColorOn(giveColor,color);	
</script>