用jquery在`select`中更改'option`的文本

Question

所以，我試圖用jquery更改一個選項的文本。

HTML

<select id="mySelect"> 
    <option value="change me">Change me</option> 
</select> 

JS

$(document).ready(function() { 
    $('#mySelect').select2(); 
$(document).find('option[value="change me"]').text('Changed'); 
}) 

嘛，沒什麼happends。
改變文本「live」很重要。
小提琴：https://jsfiddle.net/gmt22ffL/2/

這甚至有可能嗎？
我爲我的選擇使用Jquery插件「Select2」。

Answer 1

它的工作原理perfectly fine。但是，讓我們嘗試將選擇二看：

$(document).ready(function() { 
 
    $('option[value="change me"]').text('Changed'); 
 
    $('#mySelect').select2(); 
 
});

<script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.full.min.js"></script> 
 
<select id="mySelect"> 
 
    <option value="change me">Change me</option> 
 
</select>

交換行工作。

破壞和改變：

$(document).ready(function() { 
 
    $('#mySelect').select2(); 
 
    $('#mySelect').select2("destroy"); 
 
    $('option[value="change me"]').text('Changed'); 
 
    $('#mySelect').select2(); 
 
});

<script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.full.min.js"></script> 
 
<select id="mySelect"> 
 
    <option value="change me">Change me</option> 
 
</select>