Replace select option text using jquery

Question

I try to change the text of one of select option through jquery. But it's not working.

$(document).ready(function() {
  var els = $('#coupon-options select').find('option[text="Unknown"]'); // tried .text('sd')
  $.each(els, function(i, v) {
    v.text('sd') // tried $(this).text('sd')
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="coupon-options">
  <select name="asd" class="form-control" title="" id="gfhfg">
    <option value="1" selected="">Unknown</option>
    <option value="2">Yes</option>
    <option value="3">No</option>
  </select>
</div>

Also don't use $.each on jQuery objects: `$('#gfhfg').find(".....").each(function() { console.log(this.value) });` — mplungjan, Oct 02 '19 at 06:11
@mplungjan I got those reps by hacking the SO server. I tried nearly 4 or 5 answers. But none works. — Avinash Raj, Oct 02 '19 at 06:11
Shorter version: https://stackoverflow.com/a/13644610/295783 — mplungjan, Oct 02 '19 at 06:13

score 4 · Accepted Answer · answered Oct 02 '19 at 06:11

4

You can try with jQuery's :contains() Selector

$(document).ready(function() {
  var op = $('#coupon-options select option:contains(Unknown)');
  op.text('sd')
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="coupon-options">
  <select name="asd" class="form-control" title="" id="gfhfg">
    <option value="1" selected="">Unknown</option>
    <option value="2">Yes</option>
    <option value="3">No</option>
  </select>
</div>

answered Oct 02 '19 at 06:11

Mamun

66,969
9
47
59

Dupe dupe dupe dupe https://stackoverflow.com/a/13644610/295783 – mplungjan Oct 02 '19 at 06:15
You may have to filter that if there are more than one text containing the word you have in contains – mplungjan Oct 02 '19 at 06:16

Replace select option text using jquery

1 Answers1