selects.js

$("select").each(function(){
  	$(this).wrap('<div class="selectbox"/>');
		$(this).after("<span class='selecttext'></span><span class='select-arrow'></span>");
		var val = $(this).children("option:selected").text();
		$(this).next(".selecttext").text(val);
		$(this).change(function(){
			var val = $(this).children("option:selected").text();
			$(this).next(".selecttext").text(val);
		});
	});

selects.scss

.selectbox {  
  position: relative;  
  display: inline-block;
 } 
.selectbox select {  
  z-index: 10;  
  position: relative;  
  border: none;  
  width: 100%;
  outline: none;
  padding-left: 8px;
  margin: 0;
  opacity: 0;  
  filter: alpha(opacity=0);
 }
 .selecttext {  
   z-index: 9;  
   position: absolute;  
   left: 0;
   top: 0;
   display: inline-block;
}
.select-arrow {
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  right: 10%;
}