Javascript 使用同一类向div添加不同的id

我想知道如何使用同一个类添加不同的id我想做的是编辑每个单独的可拖动的我需要的是生成不同的id，这样我可以编辑每个可拖动的我的id=“monkey”我需要的是id=“monkey1”monkey2 exc

var z=1//使div可重叠的值
$（“#添加文本”）。单击（函数（e）{
/**使div可拖动**/
$('', {
类：“ui小部件内容”，
附录：'.container'，
可拖动：{
包含：'父'，
开始：功能（事件、用户界面）{
$（this.css（'z-index'，++z）；
}
}
});
});
$（document）.on（“dblclick”，'.text'，function（）
{
$（this.hide（）；$（this.item'）.find（'.edit_text'）.val（$（this.text（））.show（）；
});
$（文档）。在（“单击“，”。编辑文本”，函数（）上
{
返回false；
});
$（文档）。在（“单击”，函数（）上）
{
var editingText=$（'.edit_text:visible'）；
如果（编辑文本长度）
{
editingText.hide（）；
editingText.closest（'.item'）.find（'.text'）.text（$（editingText.val（））.show（）；
}
});
ko.bindingHandlers.draggable={
init：函数（元素、valueAccessor、allBindingsAccessor、viewModel）{
$（元素）.draggable（）；
}
};
var vm=函数（）{
var self=这个；
self.items=ko.observearray（）；
self.textContent=ko.可观察（“”）；
self.init=函数（）{
自身项目（[]）；
}
self.remove=功能（项目）{
控制台日志（项目）；
self.items.remove（项目）；
}
self.addNew=函数（）{
self.items.push（self.textContent（））；
self.textContent（“”）；
}
self.init（）；
}
应用绑定（新vm（））
.item{
宽度：200px；
高度：200px；
填充：0.5em；
背景：黄色；
z指数：1；
显示：块；
}
.编辑文本
{
显示：无；
}
.fix_backround
{
背景色：透明；
}
.集装箱{
宽度：500px；
高度：500px；
边框：2倍实心；
位置：相对位置；
溢出：自动；
}


生成新Div
[x] 


这里有一把小提琴，演示如何做到这一点：


它的主要部分是：

ko.bindingHandlers.draggable={
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).draggable();
        $(element).attr('id', 'monkey'+itemsAdded)

        itemsAdded = itemsAdded + 1
    }
};

每次添加一个项目并将其附加到新生成的div时，都会增加一个索引？我该怎么做？希望您现在可以看到小提琴，我忘了将其公开：）