jQuery Fairydust to help style form inputs...

gistfile1.js

$(document).ready(function() {

	$('input:file').each(function(index) {
		
		$(this).wrap('<label class="file-input"></label>').wrap('<div class="file-wrapper" style="position:relative;"></div>');
		$('.file-wrapper').prepend('<span class="file-input-title">Upload file</span>').append('<span class="file-input-path">...</span>');
		$(this).css({'opacity':'0.0', 'position':'absolute', 'top':'0', 'left':'0'});
		
		$(this).change(function(){
			var value = $(this).val();
			var context = $(this);
			value = value.substring(value.lastIndexOf('/')+1);
			$('span.file-input-path').html(value);
		});
		
	});
		
	$('select').each(function(index) {
		
		var select = $(this);
		var selectId = select.attr('id');
		var selectName = select.attr('name');
		var list_stack = '';
		var selected_item = '';
		var option = '';
		var html = '';
		var value = '';
		
		$('option', select).each(function(index) {
			option = $(this);
			html = option.html();
			value = option.attr('value');
			if(option.attr('selected')){
				selected_item = '<li class="selected"><a href="#">'+html+'</a></li>';
				list_stack += '<li class="active ';
				html = '<span>&#x2713;</span>'+html
			}else{
				list_stack += '<li class="';
			};
			list_stack += value+'"><a href="#">'+html+'</a></li>';
		});
		
		list_stack = '<li class="select-replace-button"><a href="#">...</a></li><ul class="options" style="display:none;">'+list_stack+'</ul>';
		if(selected_item != undefined){ list_stack += selected_item; };
		select.replaceWith('<ul id="replacement_'+selectId+'" class="select-replace">'+list_stack+'</ul>');
		$('form').append('<input type="hidden" name="'+selectName+'" id="'+selectId+'" value="'+value+'" />');
	});
	
	$('dd.field').bind('click', function(event) {
		
		var $eventTarget = $(event.target);
		
		if($eventTarget.is('input:file')){
			return true;
		};
		
		if($eventTarget.is('ul.select-replace li')){
			var context = $eventTarget.parents('ul.select-replace');
			$('ul.options', context).fadeIn(250);
			
			// Close option display
			$('body').bind('click', function(){
				$('ul.options', context).fadeOut(250);
				$(this).unbind('click');
				return false;
			});
			
			$('ul.options li a', context).bind('click', function(){
				$('ul.options', context).fadeOut(250);
				
				$('span', $(this)).remove();
				
				if($(this).parent().hasClass('active')){
					$(this).parent().removeClass('active');
				}
				
				var new_label = $(this).html()
				
				$('li.selected a', context).html(new_label);
				
				var hidden_field = context.attr('id').substring(12);
				hidden_field = 'input#'+hidden_field;
				var new_val = $(this).parent().attr('class');
				
				$(hidden_field).val(new_val);
				
				$('ul.options li.active span', context).remove();
				$('ul.options li.active', context).removeClass('active');
				$(this).parent().addClass('active');
				$(this).prepend('<span>&#x2713;</span>');
				
				$(this).unbind('click')
				return false
			});					
			
			return false;
		};
		
	});

});