(function($){
	$.fn.selectoul = function(options) {
		var options = $.extend({},$.fn.selectoul.defaults, options);
		 
			function convertSelectToUl(theSelectID){
				$('#' + theSelectID + ' option').each(function(index) {
					var  lista = '<li rel="' + $(this).attr('value') + '">' + $(this).text() + "</li>";
					$("."+ theSelectID +"").append(lista);
				});
				$('#' + theSelectID).remove();
				
			}
			
			function findTheSelect () {
				 $("select."+options.selectClass).each(function(){
					
					var theSelectID = $("." + options.selectClass).attr("id");
					var theSelectName = $("." + options.selectClass).attr("name");
					var selectedItem = $('#' + theSelectID + ' :selected').text();
					var selectedItemValue = $('#' + theSelectID + ' :selected').attr('value');
					
					$("." + options.selectClass).parent().append("<div class='"+options.ulWrapClass+"'><input class='hidval' name='"+theSelectName+"' type='hidden' value='"+selectedItemValue+"'><span class='"+options.selectedItemClass+"'><b>" + selectedItem + "</b></span><ul class='"+ options.ulClass +" "+ theSelectID + "'></ul></div>");
					
					convertSelectToUl(theSelectID)
					
				});	
			}
			findTheSelect()
			
			/* the dropdown effect */
			$('.'+ options.ulClass).hide(); //hiding the already converded dropdowns
			$('.'+ options.selectedItemClass).click(function(){
					$(this).parent().find("ul").show();
					$('.'+ options.selectedItemClass).mouseout(function(){
						$(this).parent().find("ul").hide();
						
					})
					$(this).parent().find("ul").mouseover(function(){
						$(this).parent().find("ul").show();
					}).mouseout(function(){
						$(this).parent().find("ul").hide();
					});
				});


			//clicking on the dropdown's elements
			$('.'+ options.ulClass +' li').click(function(){
				$(this).parent().hide();
				clickedItem = $(this).text();
                                var clickedItemVal = $(this).attr('rel');
				$(this).parent().parent().find(".hidval").val(clickedItemVal);
				$(this).parent().parent().find("." + options.selectedItemClass + " b").html(clickedItem);
                                if(options.callback) {
                                    options.callback();
                                }
			})
	
		
	};
	
	/* setting up the default values */
	$.fn.selectoul.defaults = {
		selectClass: "convertToUl", //the class of SELECT element to be converted [select]
		ulWrapClass: "fancyDrpDwn", //choose a class for the genereated's list wrapper [div]
		ulClass: "exSelect", //choose a class for the genereated's list [ul]
		selectedItemClass: "selectedFromList", //choose a class for the selected item box [span]
                callback: null
	};
})(jQuery);
