Javascript 如何使用具有唯一id/名称的JQuery增加/附加单选按钮？

我想做的是用一个简单的“确认/拒绝”选项增加/附加单选按钮。 从逻辑上讲，当我们附加或增加单选按钮时，单选按钮的id和名称会发生变化

所以我想弄明白的是：每当我们点击一个按钮，它就会添加：

<H1>David's Attendance: <span>Confirmed</span></H1> 

David的出席：已确认

带有确认和拒绝单选按钮，因此无论何时选择任一选项， 从“已确认”更改为“已拒绝”。那部分有效

问题是每次生成元素时，所有跨度都会发生变化。我想要一种生成单选按钮的方法，它只适用于生成的H1“部分”。其思想是：单击一个按钮生成一个

<H1>David's Attendance: <span>Confirmed</span></H1> 

David的出席：已确认

带有一个确认和拒绝单选按钮，该按钮将更改该范围；再次单击该按钮，它将生成另一个

<H1>David's Attendance: <span>Confirmed</span></H1> 

David的出席：已确认

带有确认和拒绝单选按钮，该按钮将更改跨度（而不是生成的所有两个跨度）

我知道很难理解我想说的话，但这里是

---

谢谢大家的帮助

首先，您应该注意，您试图做的事情，为元素分配动态标识符，是一种应该避免的反模式

为了更好地解决这个问题，可以使用类和DOM遍历来根据已知的HTML结构查找相关元素，从而保持代码干燥

在您的特定情况下，您可以使用

closest（）

获取包含的

div

，然后使用

find（）

获取其中的

.attention

元素，然后再根据所选单选按钮设置文本。试试这个：

$（'.add_attr'）。单击（函数（e）{
e、 预防默认值（）；
var newIndex=$（'.attr_entry'）。长度；
$（.attr\u entry:first”）.clone（true）.removeClass（'existent'）.insertAfter（.attr\u entry:last”）.find（'input[type=“radio”]'）.prop（'name'，'designator['+newIndex+']）；
});
$（'.remove_attr'）。单击（函数（e）{
e、 预防默认值（）；
var$entry=$（this）.closest（'.attr_entry'）；
if（$entry.hasClass（'existing'））{
警报（'您不能删除第一个属性项'）；
}否则{
$entry.remove（）；
}
});
$（'.radio'）.change（函数（）{
var$attention=$（this）.closest（'.attr_entry'）。find（'.attention'）；
$attention.text（this.value='1'？'confirm'：'dependent'）；
});
h1{
颜色：黑色；
字体系列：“信使新”，monospace；
左边距：-10px；
}

大卫的出席：确认


证实
减少
感谢@Rory（似乎无法直接回复评论）提供您的解决方案！您熟悉Node JS吗？因为我正试图在Node JS中添加一个文件，该文件将在每次提交表单时增加单选按钮。完成！再次感谢你的解决方案，这确实帮了我很大的忙，祝你度过愉快的一天！