JSFiddle - React, Tailwind, and code Playground

by Pangur Ban

HTML

<div class="select_main">
	<p></p>
	<select name="version_pledge" id="calc_region_1">
		<option value="">Выберите вариант залога</option>
		<option value="1">Залог автомобиля</option>
		<option value="2">Залог недвижимости</option>
		<option value="3">Залог бизнеса</option>						
	</select>
</div>

CSS

.select_main{
margin:0 auto 10px;
height: 40px;
width:200px; 
position:relative; 
border:1px solid #999a9a;
background:#b0b3b6;
}
select {
width:100%; 
height:40px; 
position:reative; 
border:none; 
cursor:pointer; 
opacity:0;
filter: alpha(opacity=0);
}

.select_main p {
width:100%; 
height:100%; 
position:absolute; 
left:0; 
top:
color:#0a0a0a; 
font-size:14px; 
/* line-height:34px; */ 
}

JavaScript

$('select').each(function(){
	$(this).siblings('p').text( $(this).children('option:selected').text() );
});
$('select').change(function(){
	$(this).siblings('p').text( $(this).children('option:selected').text() );
});