在jQueryMobile框架下的select选择框元素，想要动态变更选中项时发现变更不了，请问有什么好办法解决吗？

Question

按正常的方法：

select1.selectedIndex = i;

不能奏效。而且现象很奇特：下拉列表中的项是选中了，但选框标题却没变。
经查看浏览器DOM树，发现<select>元素已经被jQueryMobile库改造，添加了一些<div>和<span>，变成了这样：

<div class="ui-select">
    <div id="select1-button" class="ui-btn ui-icon-carat-d ui-btn-icon-right ui-corner-all ui-shadow ui-first-child">
        <span>text2</span>
        <select id="select1">
            <option value="value1">text1</option>
            <option value="value2">text2</option>
            <option value="value3">text3</option>
        </select>
    </div>
</div>

<select>元素前面被添加了一个<span>作为选框标题。原因也正在于此。选中项动态变更了，然而<span>的内容却没有自动随之变更，故造成标题仍然不变的怪象。
实在找不到什么好办法，最后只得加了一行硬改<span>内容的语句：

select1.previousSibling.innerHTML = select1.options[i].text;

经实验，这方法可以解决问题。但总觉得这种硬改的办法不像是好办法（我不熟悉jQuery和jQueryMobile，引入它们的库进来只是纯粹起到套用其外观样式的作用）。故想请问各位大侠，这种情况有没有什么更好的解决办法吗？

Answer 1

一般来说是这样：

$('#selectId').val('select_value');