如何在javascript中动态删除表中的图标？

我想动态删除表中的图标。首先，我将在表格上显示图标。显示的图标数量取决于从数据库检索的值

当我点击一个按钮移除图标时，它没有被移除

HTML

 <td class="actions">
     <a href="" class="icon" id="plus_bintang<?= $santri->id_santri ?>" onclick="add_ubah(<?= $santri->id_santri ?>); return false"> <i class="mdi mdi-plus-square"></i></a>
     <a href="" class="icon" id="minus_bintang<?= $santri->id_santri ?>" onclick="remove_ubah(<?= $santri->id_santri ?>); return false"> <i class="mdi mdi-minus-square"></i></a>
     <div id="bintang<?= $santri->id_santri ?>">
         <input type="hidden" name="nilai[]" value="<?=$santri->nilai?>" id="nilai<?= $santri->id_santri ?>">
         <?php for ($i=0; $i <$santri->nilai ; $i++) { ?>
                <i class='mdi mdi-star'></i>
         <?php } ?>
     </div>
 </td>

Javascript

function add_ubah($id = null) {
    let bintang = document.getElementById('bintang' + $id);
    let count_bintang = bintang.getElementsByTagName('i').length;

    if (count_bintang < 5) {
        $("#bintang" + $id).prepend("<i class='mdi mdi-star'></i>");
        count_bintang = bintang.getElementsByTagName('i').length;
        document.getElementById('nilai'+$id).value = count_bintang;  
        return false;
    }else if(count_bintang == 0){
        $("#bintang" + $id).prepend("<i class='mdi mdi-star'></i>");
        count_bintang = bintang.getElementsByTagName('i').length;
        document.getElementById('nilai'+$id).value = count_bintang;  
        return false;
    }else {
        return false;
    }
}

function remove_ubah($id = null) {
    let bintang = document.getElementById('bintang' + $id);
    let count_bintang = bintang.getElementsByTagName('i').length;
    if (count_bintang > 0) {
        document.getElementById('bintang' + $id).removeChild(bintang.childNodes[0]);
        count_bintang = bintang.getElementsByTagName('i').length;
        document.getElementById('nilai'+$id).value = count_bintang;  
    } else if(count_bintang == 0) {
        return false;
    } else{
        return false;
    }
}

函数add\u ubah（$id=null）{ 让bintang=document.getElementById（'bintang'+$id）； 让count_bintang=bintang.getElementsByTagName（'i'）.length； 如果（计数小于5）{ $（“#bintang”+$id）.prepend（“”）； count_bintang=bintang.getElementsByTagName（'i'）.length； document.getElementById（'nilai'+$id）.value=count\u bintang； 返回false； }否则如果（计数=0）{ $（“#bintang”+$id）.prepend（“”）； count_bintang=bintang.getElementsByTagName（'i'）.length； document.getElementById（'nilai'+$id）.value=count\u bintang； 返回false； }否则{ 返回false； } } 函数remove_ubah（$id=null）{ 让bintang=document.getElementById（'bintang'+$id）； 让count_bintang=bintang.getElementsByTagName（'i'）.length； 如果（计数>0）{ document.getElementById（'bintang'+$id）.removeChild（bintang.childNodes[0]）； count_bintang=bintang.getElementsByTagName（'i'）.length； document.getElementById（'nilai'+$id）.value=count\u bintang； }否则如果（计数=0）{ 返回false； }否则{ 返回false； } }

---

尝试删除

div#bintangXYZ

HTML中的所有空格。请记住，

childNodes

也会返回文本节点，因此有时单击时，您只需删除星号之间的空白即可。同时放置

你在开发者控制台中看到任何错误吗？@ChrisHaas我在开发者控制台中没有看到任何错误。添加
调试器
作为
remove_ubah
函数的第一行，使用开发人员工具逐步完成，逐行观察正在发生的事情。哇，这太神奇了。成功了。谢谢你帮助我。