jQuery p：最后一个孩子不工作

Question

I'm trying to add some data to my paragraphs, how ever it is only working for my first p .

I can make it put the data into my last p by using p:gt(0) but seems like I should be able to use p:last-child .

Any idea where I'm going wrong?

HTML

<div class="col-md-12" id="quizEnd" style="display:none;text-align:center;">
  <p></p>
  <p></p>
  <h2></h2>
</div>

JS:

$("#quizEnd p:first-child").text("Navn : " + quizName);
$("#quizEnd p:last-child").text("Email : " + quizMail);

Answer 1

It's because that p element isn't the last child. The h2 elements is.

You could use :last-of-type instead:

$("#quizEnd p:last-of-type").text("Email : " + quizMail);

You could also use the .last() method or the jQuery :last selector:

$("#quizEnd p:last").text("Email : " + quizMail);

$("#quizEnd p").last().text("Email : " + quizMail);