javascript closure (loop example)

by Yury

HTML

<div id="parent"></div>
<br>

CSS

.closure-div {
    width: 100%;
    height: 30px;
}

JavaScript

makeDivs("parent");

function makeDivs(parentId) {
	for (var i=0; i < 10; i++) {
		var j = 9-i
		var div = document.createElement('div')
		div.style.backgroundColor = '#'+i+i+j+j+j+i
		div.className="closure-div"
		div.style.color = '#'+j+j+i+i+i+j
		document.getElementById(parentId).appendChild(div)
	}
}

function addEvents(divs) {
	for(var i=0; i < divs.length; i++) {	
		divs[i].innerHTML = i
		divs[i].onclick = function() { alert(i) }
	}
}

addEvents(document.getElementById('parent').childNodes);