Как добавить атрибут к элементу после использования after () в jQuery

Question

$( ".page-header")
    .after("<p>Please enter an email address</p>")
    .attr('class', 'alert alert-danger')
    .show()

Я хочу, чтобы мой тег <p> имел этот атрибут, но вместо этого он добавляется в $(".page-header"). Как мне добавить его в <p>

Answer 1

Вы ищете insertAfter().

Достигается тот же конечный результат, но порядок меняется. Это позволяет цепным методам (таким как ваш attr()) воздействовать на вновь вставленный элемент.

$( "<p>Please enter an email address</p>")
    .insertAfter(".page-header")
    .attr('class', 'alert alert-danger')
    .show()

.page-header { border: 1px solid black; padding: 20px }
.alert.alert-danger { color: red; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="page-header">Page header</div>