Abrir Imagem do href da imagem mapeada na DIV do lado

Sres.

Tenho 3 divs na minha página. Uma do lado da outra. Tenho uma imagem mapeada na primeira div da esquerda (Campo) e gostaria de que no momento do clic sobre a área mapeada (Jogador1, 2 ou 3), a imagem que seria aberta na tela,seja aberta na div da direita (Jogador).....

Fluxo

--> Usuário clica na área mapeada como Jogador 1;

--> A foto do Jogador 1 abre na div "Jogador".

Obs.: Toda vez que for clicado sobre uma área mapeada do campo (cada ponto mapedo é um jogador) a foto dele deve ser exibida na div Jogador.

O Código até onde consegui:

<div id="Campo" style="float:left; width:40%; height: 381px; border: 1px solid #1a1a1a; margin-right:7px;"> 

 <center>

 <img src="Campo de Futebol 3.jpg" alt="Campo Oficial" width="332" height="336" border="0" usemap="#Map"/>

 <map name="Map">

 <area shape="rect" coords="160,22,175,34" href="jogador 1" id="Goleiro">

 <area shape="rect" coords="126,64,141,76" href="jogador 2" alt="Lateral">

 <area shape="rect" coords="190,65,204,78" href="jogador 3" alt="Zagueiro">

 </map>

 </center>

</div>

 

 <div id="Jogador" style="float:left; width:23%; height: 381px; border: 1px solid #1a1a1a; margin-right:7px;">

 </div>

 

 <div id="Mar" style="float:left; width:19%; height:381px; border: 1px solid #1a1a1a; margin-right:7px;">

 </div>

Obrigado a todos que puderem me ajudar.