Javascript 如何在不使用类名的情况下获取网站上的常见问题？

我正试图在FAQ页面上修复这个手风琴。当您单击h3标记时，问题应打开带有答案的p标记。不幸的是，不可能使用任何类名或类似的名称。我们的客户现在可以简单地添加一个h3和一个p标签来创建一个新问题。我想一次回答一个问题。有人能帮我吗

<style>
.faq h3{ background: #e2001a; color: #fff; padding: 5px 10px; cursor: 
pointer; user-select: none;}


.show {
display: block;
}
</style>

<div class="faq">
<h1>FAQ</h1>

<h3>Question 1</h3>
 <p>Lorem ipsum</p>

 <h3>Question 2</h3>
 <p>Lorem ipsum</p>

 <h3>Question 3</h3>
 <p>Lorem ipsum</p>

用于针对每个单击的h3的段落

//抓住所有的H3和段落 const h3s=document.queryselectoral'h3'； const-paras=document.queryselectoral'p'； //向每个h3添加单击侦听器 h3s.forEachh3=>h3.addEventListener'click'，handleClick，false； 功能手柄{ //从单击的元素中获取nextElementSibling const{nextElementSibling:next}=this； //从段落中删除所有“show”类 paras.forEachpara=>para.classList.remove'show'； //将show类添加到同级段落 下一步.classList.toggle'show'； } p{ 可见性：隐藏； 高度：0px； } .表演{ 能见度：可见； 高度：自动； } 常见问题 问题1 同侧眼睑

问题2 同侧眼睑

问题3 同侧眼睑

---

选择器中有一些小错误。名称中必须有一个简单的字符串作为类名，但您可以使用查找子节点，例如

如果要使用CSS选择器，请使用：

var acc = document.querySelectorAll("div.faq > h3");
var panel = document.querySelectorAll('div.faq > p');

此示例使用GetElementsByCassName和getElementsByTagName：

var faq=document.getElementsByClassNamefaq[0]； var acc=faq.getElementsByTagName'h3'； var panel=faq.getElementsByTagName'p'； 对于var i=0；i 问题2 同侧眼睑

问题3 同侧眼睑

---

为什么不能使用类名呢？我们的客户端现在只需添加一个h3和一个p标记，就可以在我们的CMST中创建一个新问题。非常感谢您的帮助！

var acc = document.querySelectorAll("div.faq > h3");
var panel = document.querySelectorAll('div.faq > p');