Jquery循环select标签，并给指定option添加select属性后在页面上不显示的问题

<select id="testId">
   <option value="">--请选择--</option>
   <option value="1" >苹果</option>
   <option value="2">香蕉</option>
</select>  

$(function(){
    $("#testId option").each(function() {
    if($(this).val() == "香蕉") {
        $(this).attr("selected","selected");
    }else {
        $(this).removeAttr("selected")
        }
    })
})        

通过这个jQuery方法遍历option并给香蕉所在的option加上select属性时，页面上选中的还是初始的“--请选择--”，但是通过F12查看时，香蕉所在的option确实已经加上了select属性，但就是不显示。查了很多资料，有位博友说

在select 标签中添加属性autocomplete="off" ，但是这个属性貌似是html5才有的。最后没有办法了，不用循环，直接给select赋值选中

$("#testId").val("香蕉")

如果哪位大神有更好的解决方案，请私聊我。