Transformar galeria de imagens jquery em Javascript

[gisesonia 0]

Tem vários modelos de galeria de imagens na internet, mas para aprender eu queria entender duas coisas:

1 - Como eu sei qual é a nova imagem e qual é a velha no código

2 - Como trocar a imagem dentro da div container ao clicar em uma thumbnail

Achei o código Jquery que é exatamente o que eu preciso, só que eu queria transformar em javascript e não consegui por causa desses dois motivos, não sei como trocar a imagem com clique no Javascript, achei muitos tutoriais que explicam com mouseover:

http://www.livrosdomaujor.com.br/jquery/jq3/cap_12/arquivo-12.3.1c.html

//<![CDATA[
	$(document).ready(function() {
		$('.abre-fecha').hide();
		$('<div id="tela" ><img src="10.jpg" alt="Descrição da imagem" /></div>')
		.insertAfter('#galeria');
		$('.foto').click(function(event) {
			event.preventDefault();
			$('#tela img').remove();
			$('<img />')
			.attr('src', $(this).attr('src'))
			.css('opacity', '0.3')
			.appendTo('#tela')
			.animate({opacity: 1 }, 2000);
		});
	});
   // ]]>