javascript - 如何动态增加JS中的div id

Question

我想了解如何在 JS 中动态增加 div id。

我每次都添加类似的 DIV，但它们是不同的元素。

让我们考虑这个简单的例子来阐明我想要理解的内容；

<div class="test" id="b1">
    One
</div>


<div class="test" id="b2">
    Two 
</div>

<div class="test" id="b3">
    Three
</div>

<div class="test" id="b4">
    Four
</div>

你可以注意到这个脚本中有一个循环，它们都是从同一个div继承而来的，但是它们用不同的ID表示。

$('#b1').click(function() {
    alert('I am first button');
});

$('#b2').click(function() {
    alert('I am second button');
});

$('#b3').click(function() {
    alert('I am third button');
});


$('#4').click(function() {
    alert('I am fourth button');
});

我正在添加超过 100 个相同 DIv 的 DIv；但我需要对它们进行不同的注释，这样我就可以在单击每个 div 时应用效果。

为了做到这一点，我需要了解什么？

演示:http://jsfiddle.net/sL8nbx1w/2/

更新

有些人误会了我的意思，我想做的是生成 div 以及

<div class="test" id="HOW_CAN_I_Make_VARIABLES">
    One <span class="alertmsg">custom message for this button + HOW_CAN_I_Make_VARIABLES</span>
</div>

在某种程度上，我可以做类似的事情

# for every variable I have  
$('.HOW_CAN_I_Make_VARIABLES').click(function() {
    alert('I am button #' + HOW_CAN_I_Make_VARIABLES_Index);
});

Answer 1

<div id="container">
 <div></div>
 <div></div>
</div>
<script>
    $(function(){
    var i=0;
    $('#container').find('div').each(function(){
        var temp='b'+i;
        $(this).attr('id',temp);
        ++i;
        console.log($(this).attr('id'));
    });
  });
</script>