há como exibir imagens especificas a locais pre determinados em uma pagina HTML usando CSS e JS

Desejo fazer o seguinte:

Designar imagens a molduras pré definidas em uma pagina html usando javascript.

Ex. criei o seguinte código html:

<div id="container">
 <div class="menu-roupa">
 <div class="box-produto">
 <img name="imga" class="exibir-img">
 </div>

 <div class="box-produto">
 <img name="imgb" class="exibir-img">
 </div>

 <div class="box-produto">
 <img name="imgc" class="exibir-img">
 </div>
 </div>
 </div>

	 

	 

	 

	E defini o tamanho de cada moldura com o css:

#container{

 width: 100%;

/ Orientação dos blocos de conteudo dentro do bloco principal / pai/

 display: flex;
 align-items: center;
 justify-content: space-between
}

.container-index{
 height: 400px;
 background-image: url(a.png);
}

.menu-roupa{
 display: flex;
 align-items: center;
 justify-content: space-between;
 width: 80%;
 height: 550px;
 margin-left: 10%;
 margin-right: 10%;
 background-color: aquamarine;
}

.box-produto{
 width: 300px;
 height: 450px;
 background-color: bisque;
}

.exibir-img{
 height: 300px;
 width: 300px;
}

	agora quero desenvolver uma aplicação JS que desloque a imagem especifica para cada uma das box`s pre definida por  A, B e C.