$(function(){
		
		$('select#speedA').selectmenu();
		
		$('select#speedAa').selectmenu({maxHeight: 150});
		
		$('select#speedB').selectmenu({
			width: 300,
			format: addressFormatting
		});
		
		$('select#sid').selectmenu({width: 135,menuWidth: 200,maxHeight: 150,style:'dropdown'});
		$('select#cid').selectmenu({width: 180,menuWidth: 180,style:'dropdown'});
		$('select#agid').selectmenu({width: 180,menuWidth: 180,style:'dropdown'});
		
		$('select#speedD').selectmenu({
			style:'dropdown', 
			menuWidth: 400,
			format: addressFormatting
		});
				
		
	});
	
	
	//a custom format option callback
	var addressFormatting = function(text){
		var newText = text;
		//array of find replaces
		var findreps = [
			{find:/^([^\-]+) \- /g, rep: '<span class=\"ui-selectmenu-item-header\">$1</span>'},
			{find:/([^\|><]+) \| /g, rep: '<span class=\"ui-selectmenu-item-content\">$1</span>'},
			{find:/([^\|><\(\)]+) (\()/g, rep: '<span class=\"ui-selectmenu-item-content\">$1</span>$2'},
			{find:/([^\|><\(\)]+)$/g, rep: '<span class=\"ui-selectmenu-item-content\">$1</span>'},
			{find:/(\([^\|><]+\))$/g, rep: '<span class=\"ui-selectmenu-item-footer\">$1</span>'}
		];
		
		for(var i in findreps){
			newText = newText.replace(findreps[i].find, findreps[i].rep);
		}
		return newText;
	}