使用父属性的jQuery追加元素

Question

我试图用jQuery来为每个使用类button-0的元素添加一个新的子元素，其类别为button-0-text，文本等于原始button-0元素的data-text属性。我想这...

HTML：

<div class="flex fs-0 button-0" data-text="Enhance"></div> 

的Javascript：

$(".button-0").append($("<div></div>").addClass("button-0-text").text($(this).parent().attr("data-text"))); 

...但它不工作。这甚至是正确的方法吗？任何帮助将非常感激。谢谢^^

Answer 1

试试这个方法：

$('.button-0').each(function() { 
 
    $(this).append('<div class="button-0-text">' +$(this).data('text')+ '</div>'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="flex fs-0 button-0" data-text="Enhance1"></div> 
 
<div class="flex fs-0 button-0" data-text="Enhance2"></div>

Answer 2

这应做到：

var buttons = $('.button-0'); 
buttons.each(function(i, elem){ 
    var child = $('<div/>', {'class': 'button-0-text'}); 
    child.text($(this).data('text')); 
    child.appendTo(this); 
});