Javascript JQuery在注释中单击更改文本

我在JQuery中遇到了更改文本的问题

我想将折叠它更改为展开它，以便在评论中显示和隐藏回复，同时将文本从折叠它更改为展开它

此代码在第一条注释中有效，但在第二条注释、第三条注释等中无效

它可以显示和隐藏回复，但不会更改文本

这是我的查看代码：

<div id="fold " class="comment-reply-container">
   <p id="fold_p" class="toggle-reply">Fold it</p>
   <div class="comment-reply col-sm-14">

   </div>
</div>

---

首先，不能对HTML中的多个元素使用相同的id。这样，您将无法找到正确的元素并围绕它编写通用逻辑

为每个HTML元素放置唯一的id，或者使用类来标识目标元素。 下面是公共元素的

class

示例，并围绕它编写了脚本

将所有ID替换为

class

name，并将单击事件附加到toggle元素。使用

$（this）

查找所需的子元素并执行所需的操作

$（文档）.ready（函数（）{
$（“.fold”）。单击（函数（）{
var$foldP=$（this.find（“.fold_p”）；
$foldP.fadeOut（函数（）{
var text=（$foldP.text（）='Fold it'）？'Expand it'：'Fold it'；
$foldP.text（text.fadeIn（）；
$foldP.next（）.slideToggle（“慢”）；
})
})
});

折叠它

部分内容1
折叠它

部分内容2
折叠它

部分内容3
首先，尝试创建一个函数，在单击时更改文本

例如：

const toggleText = 'Fold it'; //make sure the variable's value is exactly the same as the text you are displayed
const expandText = 'Expand it';

function toggleFunction() {
  if ($("#fold_p").text() == toggleText) {
    $("#fold_p").text() = expandText;
  } else {
    $("#fold_p").text() = toggleText;
  }
}

然后在click函数中调用
toggleFunction（）
，以便在单击时调用该函数

让我知道它是否有效
最终它有效。。。谢谢你的帮助很高兴能帮助你！如果有效的话，我会稍后再尝试……）
const toggleText = 'Fold it'; //make sure the variable's value is exactly the same as the text you are displayed
const expandText = 'Expand it';

function toggleFunction() {
  if ($("#fold_p").text() == toggleText) {
    $("#fold_p").text() = expandText;
  } else {
    $("#fold_p").text() = toggleText;
  }
}