Javascript 如何遍历div中的ul元素并在提交时单独隐藏它们？

在使用express的节点应用程序中，我有一个查看功能，可以创建非活动公司列表，每个公司有两种提交输入类型“活动”和“删除”。我希望能够点击提交，并有个人ul成为隐藏。但是，我不太确定如何逐个迭代。每次我尝试都会隐藏所有元素。以下是我的查看功能：

function inactiveFiltered(companyObject) {
    return `
        <ul class="companyinfo">
            <li class="list-info">${companyObject.company_type}</li>
            <li class="list-info">${companyObject.company_name}</li>
            <li class="list-info">${companyObject.company_location}</li>
            <li class="list-info">${companyObject.company_phone}</li>
            <br>
            <li class="list-buttons">
                <form action="/activeList" method="POST" class="myform">
                    <input type="hidden" name="companyId" value="${companyObject.id}">
                    <input type="submit" value="Active">
                </form>
                <form action="/deletecompany" method="POST">
                    <input type="hidden" name="companyId" value="${companyObject.id}">
                    <input type="submit" value="Delete">
                </form>
            </li>
            <br>
        </ul>
    `
}

function inactiveList(arrayOfCompanies){
    const companyItems = arrayOfCompanies.map(inactiveFiltered).join('');

    return `
        <div class="list inactive-list">
            ${companyItems}
        </div>
    `
}

module.exports = inactiveList;

---

我被困在这个问题上太久了，我希望得到任何帮助。谢谢大家!

您同时隐藏所有元素，因为选择器

.companyinfo

使用类

companyinfo

返回所有元素的列表，这些元素在您的情况下都是公司。这就是为什么他们同时被隐藏的原因

实现目标的一种方法是将id添加到

ul

元素中，以便能够为每个公司单独寻址，如下所示：

然后添加一个方法

hideCompany（）

来替换

$（document.body）。提交（function（）

部分：

function hideCompany(companyname) {
    $('#companyinfo_' + companyname).hide();
}

---

最后，将

修改为

谢谢！效果很好。
function hideCompany(companyname) {
    $('#companyinfo_' + companyname).hide();
}