我在我的应用程序中有以下jquery代码，并将其放在。js文件中，在HTML中有以下SELECT。
null
$(function() {
for (i = 00; i < 24; i++) {
$(".abcd").append($('<option></option>').val(i).html(i))
};
var rating = ['A', 'A1', 'A2', 'B', 'C', 'D', 'E', 'F', 'G'];
for (const item of rating) {
// console.log(item);
$(".bcde").append($('<option></option>').val(item).html(item));
};
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control abcd" multiple="multiple">
</select>
<select class="form-control bcde" multiple="multiple">
</select>null
我检查了控制台日志的项目正在打印，我看到一个A1，A2，B，C，D，E，F，G，A1，A2，B，C，D，E，F，G，所有的数字从1到23都重复了两次。 你能帮我解决这个问题吗。
如果只运行一次，代码就能正常工作。 这是一个更优雅的版本
null
const $opts = [...Array(24)].map(
(_,i) => $("<option/>",{value:i,text:i}))
const $ratings = ['A', 'A1', 'A2', 'B', 'C', 'D', 'E', 'F', 'G'].map(
(item) => $("<option/>",{value:item,text:item}))
$(function() {
$(".abcd").html($opts)
$(".bcde").html($ratings);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="form-control abcd" multiple="multiple">
</select>
<select class="form-control bcde" multiple="multiple">
</select>