Drop down filter

HI I have created a filter functionality, which has two dropdowns, on the basis of selection of these dropdowns select it shows the results, but I want to modify it a little, what I am trying to achieve is, on select of single dropdown it should also show the result, which is currently not showing, please help me modify this code`

<script>
  $('#city, #state').on('change', function(){
    // set reference to select elements
    var city = $('#city');
    var state = $('#state');

    // check if user has made a selection on both dropdowns
    if ( city.prop('selectedIndex') > 0 && state.prop('selectedIndex') > 0) {
        // remove active class from current active div element
        $('.result.active').removeClass('active');
        
        // get all result divs, and filter for matching data attributes
        $('.result').filter('[data-city="' + city.val() + '"][data-state="' + state.val() + '"]').addClass('active');  
  
    }
});
  
  
</script>
<style>
  .result {display:none;}
.result.active {display:block;}
</style>  
<!-- partial:index.partial.html -->


<select id="city">
    <option value="select">CITY</option>
    <option value="beaches">Noida</option>
    <option value="museums">Mahrastra</option>
    <option value="mountains">Delhi</option>
</select>
<select id="state">
    <option value="select">STATE</option>
    <option value="chill">UP</option>
    <option value="fast-paced">Mahrastra</option>
    <option value="both">Delhi</option>
</select>


 <div class="result" data-city="beaches" data-state="chill" data-pincode="glenchill">glen gallery one</div>
 <div class="result" data-city="beaches">no gallery</div>
<div class="result" data-city="beaches" data-state="fast-paced" data-pincode="glenfast-paced">glen gallery two</div>
<div class="result" data-city="beaches" data-state="both" data-pincode="glenboth">glen gallery two</div>
<div class="result" data-city="beaches" data-state="glenchill">beaches and chill glenn</div>
<div class="result" data-city="beaches" data-state="glenfast-paced">beaches and fast-paced glenn</div>
<div class="result" data-city="beaches" data-state="glenboth">beaches and both glenn</div>
<div class="result" data-city="museums" data-state="chill">museums and chill</div>
<div class="result" data-city="museums" data-state="fast-paced">museums and fast-paced</div>
<div class="result" data-city="museums" data-state="both">museums and both</div>
<div class="result" data-city="mountains" data-state="chill">mountains and chill</div>
<div class="result" data-city="mountains" data-state="fast-paced">mountains and fast-paced</div>
<div class="result" data-city="mountains" data-state="both">mountains and both</div>

`