Chaning the select option value by jQuery

Question

I have a select html form element with a range of option values as per below.

<select name="budget" id="budget" class="selectInput required">
<option value="" selected>Select an option...</option>
<option value="£5-£10K">£5-£10K</option>
<option value="£5-£10K">£10-£15K</option>
</select>

I would like to be able to change the value of these options in jQuery - how can I do this??? I thought this would work - but it doesnt seem too?

$("#budget option[value='£5-£10K']").val('Monkeys');

eg changing the value of the option that had '£5-£10k' to become 'Monkeys'

Any ideas?

Thanks.

Answer 1

An option element has two key properties - value and text . You're changing one but not the other:

$("#budget option[value='£5-£10K']").val('Monkeys').text('Monkeys');

In no circumstance will setting the value change the text , however if your option element does not have a value attribute, the value is set to the text .

Answer 2

下面 jQuery 中的另一种方式

$("#budget>option[value='£5-£10K']").text('Monkeys or something else').val('Monkeys or whatever');