Ориентация на последнее поле формы в форме, а затем на некоторые

Question

У меня есть эта форма, где я пытаюсь нацелиться на определенный элемент, который не имеет своего собственного класса. К сожалению, я не могу изменить HTML.

Я пытаюсь настроить таргетинг на последний элемент .formfield, а затем второй тег p после этого.

Я пробовал с :last-child, :last-of-type и: nth-last-child(), но я не могу получить последний.

с html ниже, как я могу нацелиться на <p>Target me</p>?

.form form[name="pageform"] .formfield:last-child+p+p {
  color: red;
}

<div class="form">
  <form enctype="" name="pageform" onsubmit="formhandler(); return true;" action="#" method="post">
    <input type="hidden" name="form_submitted" value="1">
    <div class="formfield">...
    </div>
    <div class="formfield">...
    </div>
    <div class="formfield">...
    </div>
    <p><input type="checkbox" name="gdpr-accept"></p>
    <p>Target me</p>
    <div id="submit_div">
      <input type="submit" id="submit_button" value="Send">
    </div>
  </form>
</div>

Answer 1

Просто используйте

form[name="pageform"] p:last-of-type {
  background: red;
}

https://jsfiddle.net/jqnx9fh6/

Answer 2

Попробуйте использовать специфику CSS:

div.form form p:last-of-type {
    background: red;
}

Answer 3

Вы не можете выбрать цель последний класс . Вы можете использовать что-то на основе порядка элементов HTML, например ::1003

.formfield + p + p { }

Или это:

div:nth-last-of-type(2) + p + p { }