"Перемещение" картинки по div'ам
 

Здравствуйте, передо мной такая задача, кликнув на div1, на нем выводится картинка, кликнув на div2, картинка пропадает с первого и появляется на втором. Посоветуйте, пожалуйста, как это реализовать по-компактнее ?

P.S. У меня всего 9 таких div'ов.

открывать по e.target, запоминать текущий, его потом и скрывать

Да просто делать appendChild картинки в кликнутый div и никаких сложностей.)

А я подумал на каждый div своя картинка :)

нет, одна на все.

Да, но вся трудность в том, что она не пропадает при клике на другой.

У меня пропадает

<style>
div {
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 20px;
	border: solid 1px gray;
	float: left;
}
img {
	width: 100%; 
	height: 100%;
	border-radius: 20px;
	display: none;
}
</style>
<img src = 'http://javascript.ru/forum/image.php?u=19820&dateline=1334914235'>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

<script>
document.body.onclick= function (e) {
	e = e || event;
	var target = e.target || e.srcElement;
	var img = document.images[0];
	if (target.tagName == 'DIV') {
		img.style.display = 'block';
		target.appendChild(img);
	} 
}
</script>

PS: интересно работает в FF, затемняя при клике картинку

Эм.. А что это за знак, точнее, для чего он || ?

хм ... http://es5.javascript.ru/x11.html#x11.11 или

Я сделал картинка перебирается по DIV'ам, но по всем )
Включая картинки сайта текст и прочее ))
Можно ли как-то конкретизировать это на 9-ти. выборочных дивах ?