Javascript 单击一个div会显示一个按钮，但会隐藏其他div上的按钮

我正在尝试制作一个笔记保存应用程序，其中有许多div作为笔记，我希望每当用户单击某个特定div时，它都应该是可编辑的，并且在隐藏操作之前，div顶部会显示一个按钮。这部分我已经做了一些。现在，我希望当用户单击其他div或页面的其他部分时，已经显示的按钮会隐藏起来。 简而言之，这些div按钮应该在用户当前工作的位置可见

我不知道如何一次只看到一个按钮

我用于显示的按钮的javascript是：

edits=document.getElementsByClassName('new');
        Array.from(edits).forEach((element) => {
        child=element.childNode
            element.addEventListener("click",(e)=>
            {
                let data=e.target;
                data.contentEditable=true;
                let btn=data.getElementsByTagName('button');
                Array.from(btn).forEach(element => {
                    console.log(element);
                    element.style.display="block";
                    element.contentEditable=false;  
                });
            });
        });

这是代码的一部分

---

当您标记jQuery时，在这里您可以使用jQuery$（'body'）.on（'click'，'.new'，function（）{var self=$（this）；$（.update”）.hide（）；self.find（.update”）.show（）；）；Satinder Singh非常感谢您，它可以工作Satinder Singh如果我想在点击页面的其他部分时启用此功能，那么如何做到这一点？