// -- styled select box

function SelectReplacement(ulStr, selStr){
	var selectList = $(ulStr),
	replacedDD = $(selStr),
	listItemHeight = 31, // change this variable to reflect the height of each list item (px)
	items = selectList.find("li"),
	options = replacedDD.find("option"),
	firstLi = items[0],
	len = items.length,
	listOpen = false,
	initHTML = firstLi.innerHTML,
	setHTML = "";
	while(len--) {
		var li = items[len];
		li.idx = len;
		li.style.top = (len * listItemHeight) + "px"
	};
	$(items).click(function(){		
		if(!listOpen) {
			$(items).css("display","block");
			setTimeout(function(){
				$(document).click(function(){
					$(firstLi).click();
				});
			},1);
		} else {
			$(document).unbind("click");
			setHTML = this.innerHTML;
			$(options).attr("selected",false);
			$(options[this.idx]).attr("selected","selected");
			$(items).css("display","none");
		};
		if(setHTML == "") { setHTML = initHTML }
		firstLi.style.display = "block";
		firstLi.innerHTML = setHTML;
		listOpen = !listOpen;
	});
};
