jQuery動態載入和移除select下拉選項

我是個後端開發，工作需要在做select 聯動效果的時候要動態追加選項，實現追加後，發現修改選項的時候，下級選單會一直追加。
話不多數，直接乾貨
html程式碼示例：

<select name="name" id="id" onchange="act(this.value)">
	<option value="-1">--請選擇--</option>
</select>

js程式碼示例：

//ajax請求成功，處理資料
if(data.success){
	/**
	 * 先移除上次追加的選項（不移除的話會一直追加）
	 * */
 

     $("#id >option").each(function(){
         var id = $(this).attr("value");
         if(id !=-1){
             this.remove();
		}
     });
    /**
	 * 動態追加選中的資料
	 * */
    var act = data.data;
    for(var i=0;i<act.length;i++){
        var rep = '<option value="'+act[i].value+'">'+act[
 
i].text+'</option>'
            $("#id").append(rep);
		}
    }

只為菜鳥的自己積累