JSFiddle - React, Tailwind, and code Playground
HTML
<select id="oh_sort" name="sort">
<option calue=""></option>
<option value="date">Date</option>
<option value="price">Price</option>
<option value="city">City</option>
</select>
<div id="oh_list_cont"></div>
CSS
#oh_list_cont {
background: green;
height: 400px;
width: 200px;
}
JavaScript
$('#oh_sort').change(function(){
$('#oh_list_cont').slideUp(1000).promise().done(ohReset());
$('#oh_list_cont').slideDown(1000);
});
function getOpenhouse(){
var data = $('#oh_sort').val();
if(data == 'date'){
$('#oh_list_cont').append('WOOOOOOORK!');
}
if(data == 'price'){
$('#oh_list_cont').append('Please?!');
}
if(data == 'city'){
$('#oh_list_cont').append('OMGWTFBBQ');
}
}
function ohReset() {
$('#oh_list_cont').html('');
getOpenhouse();
}