jQuery select box .val('') behavior differs from 1.9 to 1.10+ what is the shortest way to do that [duplicate]

Question

The following behaves differently between jQuery 1.9 and 1.10+:

<select id="s1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

$('#s1 option[value=1]').hide();
$('#s1').val('');

The idea behind this code is to select the first option.

After 1.10, the $('#s1').val(''); part is no longer working in the same way. I suppose that it was never meant to be used that way but its old code and have to be modernized in some way...

After jQuery 1.10 nothing is selected and $('#s1').val() returns null.

Changing code to:

$('#s1 option[value=1]').hide();
$('#s1').val($('#s1 option').first().val());

Does the job with both new and old jQuery versions.

My question is if there is shorter/more elegant way to do the same thing?

Answer 1

$("#s1")[0].selectedIndex = 0;

You can also do this if you really like jQuery:

$("#s1").prop("selectedIndex", 0);

More here: https://stackoverflow.com/a/1314266/283863

Answer 2

Just don't set the value it selects first value automatically and works in both versions:

$('#s1 option[value=1]').remove();
//$('#s1').val('');

demo version: 1.9.1 and demo version: 1.10.1

---

As per your update and comments, you can use like this:

$('#s1 option[value=1]').hide();
$('#s1 option[value=2]').hide();
$('#s1 option:visible').first().attr('selected', 'selected');

demo