mootools

References to Documentation

1. Plugins/Sortables.js#Sortables
2. Native/Array.js#Array.each
3. Plugins/Color.js#Array.hsbToRgb
4. Native/Element.js#Element.setStyle

new Sortables($('test'), {
 
	initialize: function(){
		var step = 0;
		this.elements.each(function(element, i){
			var color = [step, 82, 87].hsbToRgb();
			element.setStyle('background-color', color);
			step = step + 35;
			element.setStyle('height', $random(40, 100));
		});
	}
 
});

<ul id="test">
	<li class="sortme">0</li>
	<li class="sortme">1</li>
	<li class="sortme">2</li>
	<li class="sortme">3</li>
	<li class="sortme">4</li>
	<li class="sortme">5</li>
	<li class="sortme">6</li>
	<li class="sortme">7</li>
	<li class="sortme">8</li>
	<li class="sortme">9</li>
	<li class="sortme">10</li>
</ul>

#test { 
	position: inherit;
}
 
ul#sortables {
	width: 300px;
	margin: 0;
	padding: 0;
}
 
li.sortme {
	padding: 4px 8px;
	color: #fff;
	cursor: pointer;
	list-style: none;
	width: 300px;
	background-color: #222;
}
 
ul#sortables li {
	margin: 10px 0;
}