Javascript 动态按钮只能工作一次，但不能多次工作

首先，我英语说得不是很好。 我希望道歉

这是我的问题：

我用jquery->append动态创建了一个按钮。我需要此按钮将标签的值从

id=“exampleid”

更改为

value=“examplefrom”

我创建了许多具有相同ID的按钮（example=ID“exampleidbuttom”），并使用

jquery.ON

向它们添加事件

按钮将其值从“我的标签”更改一次，而不再更改

我不明白为什么，我尝试了很多

这里有一个例子：

HTML：

<a href="#"  id="nuevoBoton">Añadir botón</a>
<div id="contenedor">
<a href="#" class="boton" data-val="1">Pulsa</a>
<input type="text" class="form-control" id="idname" placeholder="Ingresa el nombre del tipo de usuario que deseas crear" name="name"  data-toggle="popover" value="kkk"    dismisible value="">
</div>

JavaScript：

$("#nuevoBoton").on('click',function() {

var boton = '<button href="#" class="boton" data-val="' + parseInt(Math.random()*10)+ '">Pulsa</button>';

$('#contenedor').append(boton);    
    $("#contenedor").on('click','button.boton', function() {
     alert('El valor es: ' + $(this).data('val'));  
    $("#idname").remove("value");     
     $("#idname").attr("value","fdfdf");    

   })

$（“#新波顿”）。在（'click'，function（）上{
var boton='脉冲'；
$（'#contendor'）.append（boton）；
$（“#contendor”）。在（'click'，'button.boton'，function（）上{
警报（'El valor es:'+$（this）.data（'val'）；
$（“#idname”）。删除（“值”）；
$（“#idname”）.attr（“值”、“FDF”）；
})

解析后，这里是代码

var lastLabel="#idname";
$("#nuevoBoton").on('click',function() {


    var newLabel = "#label"+parseInt(Math.random()*10)


       $(lastLabel).attr("id",newLabel);   
    console.log(newLabel+"-"+lastLabel);
    lastLabel = newLabel;

})

.remove（）

用于删除元素，而不是属性。