Cuando coges con el nombre de la clase, te coge un array mpor lo que tienes que recorrer los elemntos para poder cambiar el estilo de estos.
function change(icolorName) {
var elements = document.getElementsByClassName("color");
for (var i = 0; i < elements.length; i++) {
elements[i].style.backgroundColor="blue";backgroundColor=colorName;
}
}
.div-1 {
background-color: orange;
width: 50px;
height: 50px;
float: left;
margin: 5px
}
.div-2 {
background-color: black;
width: 50px;
height: 50px;
float: left;
margin: 5px
}
.div-3 {
background-color: green;
width: 50px;
height: 50px;
float: left;
margin: 5px
}
.div-4 {
background-color: red;
width: 50px;
height: 50px;
float: left;
margin: 5px
}
.color {
background-color: transparent;
border: 2px solid #000;
width: 50px;
height: 50px;
float: left;
margin: 5px;
}
<div class="div-1" onclick="change('orange')"></div>
<div class="div-2" onclick="change('black')"></div>
<div class="div-3" onclick="change('green')"></div>
<div class="div-4" onclick="change('red')"></div>
<div class="color"></div>