[MishaUA]

Привет!
Я С++ прогер, сейчас изучаю web программирование.
Нужно построить довольно сложную (для меня) структуру объектов. Суть в том, что есть объект, который хранит в себе еще несколько, эти еще и т.д. На странице в динамическом режиме создаются элементы, у каждого элемента onclick должен изменять содержимое заданного объекта.
Небольшой пример:

var components = {};

function func(inputData) {
		
	for (var i=0; i<5; i++) {
		var component = components[i+""],
			data = inputData["d"+i];
			
		components[i+""] = document.createElement("div");
		components[i+""].innerText = data.text;
		components[i+""].onclick = function() {
			data.text = "hello";
			// вот эта часть не правильно работает (да и не должна вроде бы). Я не знаю, как правильно здесь записать.
			// Если сделать вывод в консоль, то при клике в data находится последний элемент (№4)
			// Нужно сделать так, чтобы при клике в data хранился указатель на нужный объект.
		}
	}
	
}

var ddd = {
	d0: {text: "0"},
	d1: {text: "1"},
	d2: {text: "2"},
	d3: {text: "3"},
	d4: {text: "4"}
}

func(ddd);

Создается множество div'ов, при клике они должны изменять переменную text в нужном объекте. Основная проблема в том, что я не знаю, как правильно в обработчике onclick указать объект, с которым нужно работать.
PS: реальная структура (можно сказать, дерево) объекта ddd гораздо сложней.
Спасибо!