[danik.js]

Имеется вот такая вот функция:

/**
 * Render messages send via JSON
 *
 * @param	object	messages	JavaScript object containing the messages to render
 * @return	void
 */
 
Joomla.renderMessages = function(messages) {
	Joomla.removeMessages();
	var container = document.id('system-message-container');

	var dl = new Element('dl', {
		id: 'system-message',
		role: 'alert'
	});
	Object.each(messages, function (item, type) {
		var dt = new Element('dt', {
			'class': type,
			html: type
		});
		dt.inject(dl);
		var dd = new Element('dd', {
			'class': type
		});
		dd.addClass('message');
		var list = new Element('ul');

		Array.each(item, function (item, index, object) {
			var li = new Element('li', {
				html: item
			});
			li.inject(list);
		}, this);
		list.inject(dd);
		dd.inject(dl);
	}, this);
	dl.inject(container);
};

/**
 * Remove messages
 *
 * @return	void
 */
Joomla.removeMessages = function() {
	var children = $$('#system-message-container > *');
	children.destroy();
}

messages выглядит примерно так :

{errors: ['Error 1 ', 'Error 2'], notices: ['Notice 1', 'Notice 2']}

Это взято как можно заметить из джумлы.
Я много работаю с этой cms'кой, и тенденция разработчиков к вживлению мутулзов даже на простую контентную страницу, не имеющую никакой динамичности меня обеспокоила. И я предложил немного отделить мух от котлет. Короче, предыстория эта нафиг не нужна никому Вот что нужно сделать:

Нужно переписать эти две функции так чтобы они не зависили от MooTools, тоесть работали без него, но при этом не должна пострадать совместимость с браузерами.

Пока что у меня получилось это:

JJoomla.renderMessages = function(messages) {
	Joomla.removeMessages();
	var container = document.getElementById('system-message-container');

	var dl = document.createElement('dl');
	dl.id = 'system-message';
	dl.role = 'alert';

	Object.each(messages, function (item, type) {
		var dt = document.createElement('dt');
		dt.className = type;
		dt.innerHTML = type;
		dl.appendChild(dt);

		var dd = documentElement('dd');
		dd.className = type + ' message';

		var list = document.createElement('ul');

		Array.each(item, function (item, index, object) {
			var li = document.createElement('li');
			li.innerHTML = item;
			list.appendChild(li);
		}, this);
		
		dd.appendChild(list);
		dl.appendChild(dd);

	}, this);
	container.appendChild(dl);
};

Как грамотно заменить итерацию по свойствам объекта и элементам массива я не знаю. Я так же не уверен что все делаю правильно.

Вот готовая тестовая площадка

Просьба помочь, думаю тут несложно.