JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/jquery/sizzle/raw/c488e18facdf50de2d272a052d1e0f663ec19fd4/sizzle.js"></script>
<select>
 <option value='non-default'>non-default</option> 
 <option value='default' selected>default</option>
</select>
<input type='button' value='click me!'/>
<div id='jqVersion'></div>
    
<code>.find('option[selected]')</code>: <span id='find'></span><br/>
<code>.find('option').filter('[selected]')</code>: <span id='filter'></span><br/>
<code>jQuery.find('[selected]', …, options)</code>: <span id='jQuery_find'></span><br/>
<code>Sizzle('[selected]', …, options)</code>: <span id='Sizzle'></span><br/>

JavaScript

function SetResult(ResultObj, ElementObj) {
    ResultObj.text(
        jQuery.map(ElementObj, function(el) {
            return jQuery(el).val();
        }).join(" , ")
    );
}

$(function() {
    $('input[type=button]').click(function() {
        var SelectObj = $('select').val('non-default');

        // The following calls are expected to give identical results, but they don't.
        SetResult($("#find"), SelectObj.find('option[selected]'));
        SetResult($("#filter"), SelectObj.find('option').filter('[selected]'));
        SetResult($("#jQuery_find"), jQuery.find( '[selected]', null, null, SelectObj.find("option")));
        SetResult($("#Sizzle"), Sizzle( '[selected]', null, null, SelectObj.find("option")));
    });
});

$('#jqVersion').text('jQuery version: ' + $.fn.jquery);