[Hovik]

Здравствуете, подскажите пожалуйста как можно с помощью js добавлять в определённою диву класс и одновременно удалит с других этот класс.


<div class="img" id="img">
<div id="img1" class="img2">1</div>
<div id="img2" class="img1">2</div>
<div id="img3" class="img1">3</div>
<div id="img4" class="img1">4</div>
<div id="img5" class="img1">5</div>
</div>

<div class="button">
<div class="klor klor1" onclick="red()">red</div>
<div class="klor klor2" onclick="blue()">blue</div>
<div class="klor klor3" onclick="green()">green</div>
<div class="klor klor3" onclick="yellow()">yellow</div>
<div class="klor klor3" onclick="gold()">gold</div>
</div>


<style>

.button {
display: flex;
}
.klor{
width: 40px;
height: 40px;
border-radius: 50%;
margin: 10px;
cursor: pointer;
background:red;
}

.img {
position: relative;
}

.img2{
display: block;
}

#img1, #img2, #img3, #img4, #img5{
width: 400px;
height: 300px;
position: absolute;
top: 100px;
left: 50px;
}

#img1{
background: red;
}

#img2{
background: blue
}

#img3{
background: green
}

#img4{
background: yellow;
}

#img5{
background: gold
}

.img1{
display: none;
}
.img2{
display: block;
}

</style>