如何使用jQuery appendTo在同一行添加标签文本？

Question

我要为标签的文本追加单击添加标签按钮，在类似下面一行时，

值1，值2，值3和等....

但我不能够达到什么样的我想，这里怎么了？这里是jsfiddle。

http://jsfiddle.net/KendoDev/7ot577qp/

<div style="display:inline"> 
    <button id="addButton" > Add Label </button> 

</div> 
<div id="holder"> 




    $(document).ready(function() { 
    var i = 0 ; 
    var labelID = ''; 
    $("#addButton").click(function(){ 
    i = i+1; 
     labelID= 'label'+i+ ','; 
     $('<div />', { 

     }) 
      .addClass("label") 
      .appendTo("#holder"); 
     $('<label />', { 
      for: 'holder'  
     }) 
      .attr('id', labelID) 
      .text("Value" + i) 
      .appendTo("#holder") 
     .click(function (e) { 
       var name = $('#'+labelID).text(); 
      alert("event fired: text is: "+ e.currentTarget.textContent + " \n label id is: " + e.currentTarget.id); 
     });  
     $('<div> , </div>') 
      .appendTo("#holder"); 

    }); 

    }); 

Answer 1

只要不使用块级元素。

http://jsfiddle.net/KendoDev/7ot577qp/9/

$(document).ready(function() { 
var i = 0 ; 
var labelID = ''; 
$("#addButton").click(function(){ 
i = i+1; 
    labelID= 'label'+i+ ','; 
    $('<span>') 
     .addClass("label") 
     .appendTo("#holder"); 
    $('<label>', { 
     for: 'holder'  
    }) 
     .attr('id', labelID) 
     .text("Value" + i) 
     .appendTo("#holder") 
    .click(function (e) { 
      var name = $('#'+labelID).text(); 
     alert("event fired: text is: "+ e.currentTarget.textContent + " \n label id is: " + e.currentTarget.id); 
    });  
    $('<span> , </span>') 
     .appendTo("#holder"); 

}); 

}); 

Answer 2

div就像是一个块因此它需要完整的空间，并在div后，你的下一个元素开始，在默认情况下div显示属性是块，将其更改为内嵌，以便它不占用所有空间并允许其前面的元素以单行显示：

$('<div> , </div>').css("display","inline") 

UPDATED FIDDLE

Answer 3

希望这是你想acheive

$(document).ready(function() { 
    var i = 0 ; 
    var labelID = ''; 
    $("#addButton").click(function(){ 
     i = i+1; 
     $('<div><label for="holder" id="label'+i+'">Value'+i+'</label>,</div>').appendTo("#holder"); 
    }); 
}); 

Answer 4

$(document).ready(function() { 

    var i = 1; 

    $("#addButton").click(function(){ 
     $('#holder').append("<label for='holder' id=label"+i+">Value"+i+", </label>"); 
     i++; 
    }); 

}); 

http://jsfiddle.net/7ot577qp/4/

什么