javascript - How to set the first option on a select box using jQuery?

Question

I have two HTML select boxes. I need to reset one select box when I make a selection in another.

<select id="name" >
    <option value="">select all</option>
    <option value="1">Text 1</option>
    <option value="2">Text 2</option>
    <option value="3">Text 3</option>
</select>

<select id="name2" >
    <option value="">select all</option>
    <option value="1">Text 1</option>
    <option value="2">Text 2</option>
    <option value="3">Text 3</option>
</select>

When I select an option of the first select (i.e. id="name"), I need to reset the second select to select all; similarly, when I select an option of the second select (i.e. id="name2"), I need to reset the first select to select all.

How can I do that?

Answer 1

Something like this should do the trick: https://jsfiddle.net/TmJCE/898/

$('#name2').change(function(){
    $('#name').prop('selectedIndex',0);
});


$('#name').change(function(){
    $('#name2').prop('selectedIndex',0);
});