jquery - 如何将类添加到页面稍后出现的元素？

Question

我有以下 jquery 代码：

$('.kv-editable-reset').addClass('green');

这应该将类“green”添加到此元素：

<button type="button" class="btn kv-editable-reset"></button>

但它不起作用，因为 .kv-editable-reset 仅在页面稍后出现，单击以下按钮后：

<button type="button" class="kv-editable-link"></button>

如何检测仅在单击另一个元素后才出现在页面中的元素？

标签： jqueryhtmlcss

Answer 1

只需听该按钮的单击事件，然后重新添加.green类。

通过使用.toggleClass('green', true)，您甚至不必关心拿起预先存在的按钮并将此类重新分配给它们

$(() => {
  $('.kv-editable-link').on('click', function() {
    $("html").append(`<button type="button" class="btn kv-editable-reset">kv-editable-reset</button>`);
    $('.kv-editable-reset').toggleClass('green', true);
  });
});

.green{
  background-color: #0f0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="kv-editable-link">kv-editable-link</button>