将第一个可见选项设置为默认值

我有一个过滤器方法，每当更改日期和时间时，就调用函数checkRoom();。这个函数基本上过滤了一些完全工作的选项。我现在的问题是，即使选项被过滤了，过滤后的值仍然显示在顶部。现在，如何将第一个可见选项设置为默认值呢?

我试过使用这两个代码，但它不工作。document.getElementById("room4").value = ('option:visible').first().attr('selected', 'selected');

jQuery(".roomss option:first-child:visible").attr("selected", true);

<select name="room4" id="room4" class="roomss form-control placeholder-no-fix" style="display: inline; width: 30%;">
    <option value="1" class="roomnumber1">1</option>
    <option value="2" class="roomnumber2">2</option>
    <option value="3" class="roomnumber3">3</option>
    <option value="4" class="roomnumber4">4</option>
    <option value="5" class="roomnumber5">5</option>
    <option value="6" class="roomnumber6">6</option>
</select>

        function checkRoom() {
            var date = document.getElementById("date4").value;
            var time = document.getElementById("time4").value;
            var str = date + " " + time + ":00.0";
            $('option.roomnumber1').show();
            $('option.roomnumber2').show();
            $('option.roomnumber3').show();
            $('option.roomnumber4').show();
            $('option.roomnumber5').show();
            $('option.roomnumber6').show();
            for(var i = 0; i < orderids.length; i++) {
                if(str === scheduledates[i]) {
                    if(rooms[i] !== "null") {
                        $('option.roomnumber' + rooms[i]).hide();
                    }
                }
            }
            // insert code that sets first visible option as default value
        }