How to get drop-down list item by specific text(case insensitive)

Question

I worked with J-Query, I have a problem in getting options value. I want to get option which have a specific text(text is case insensitive). I used following code -

My Html Code is -

<select id="ddlStateList_CA">
            <option value="AB">Alberta</option>
            <option value="BC">British Columbia</option>
            <option value="MB">Manitoba</option>
            <option value="NB">New Brunswick</option>
            <option value="NL">Newfoundland and Labrador</option>
            <option value="NT">Northwest Territories</option>
            <option value="NS">Nova Scotia</option>
            <option value="NU">Nunavut</option>
            <option value="ON">Ontario</option>
            <option value="PE">Prince Edward Island</option>
            <option value="QC">Quebec</option>
            <option value="SK">Saskatchewan</option>
            <option value="YT">Yukon</option>
        </select>

Jquery code -

$('#ddlStateList_CA option:contains("Manitoba")').val();

When run this code, i get correct result. but when run following Jquery code i got undefined.

$('#ddlStateList_CA option:contains("manitoba")').val();

I known Manitoba and manitoba is not same, but if i want to do this work for both case How can i do this?

Example

Answer 1

Use filter

$('#button').click(function() {
    console.log($("select option").filter(function() {
        return $(this).text().toLowerCase() === 'manitoBa'.toLowerCase();
    }).text());
});

JSFiddle