Добавление элемента «LI» перед последним тегом LI

Question

После нажатия на кнопку «Добавить комментарий» я хочу добавить <li> </li> в конце, но до последнего <li>.

См. Код:

<div class="newsComment">
  <ul class="CommentReplies">
     <li class="Heading">
       <h3> Comments </h3>
     </li>
      <li class="CommentRow"> Comment 1 </li>
      <li class="CommentRow"> Comment 2 </li>
      // ADD LI HERE WHEN CLICKING ON THE BUTTON
     <li class="CommentRow">
      <form id="FormAddComment">
       <input name="comment" type="text" />
       <input id="submit_AddNewsComment" type="submit" value="Add Comment" />
       </form>
     </li>
   </ul>
</div>


$("#FormAddComment").submit(function() {
    data =  $(this).serialize();
    //Add LI
    return false;
});

Answer 1

Поскольку форма находится внутри li, используйте closest, чтобы найти ее, затем before, чтобы вставить перед ней.

$("#FormAddComment").submit(function() {
    var $this = $(this);

    data =  $this.serialize();

    //Add LI
    $this.closest("li").before(
        "<li>New content</li"
    );

    return false;
});

Answer 2

$(this).closest('.CommentRow').before($('<li />')); должен это сделать.

Answer 3

Внутри вашей $("#FormAddComment") функции отправки это вставит <li>

$(this).closest('.CommentReplies').find('li:last').prepend('<li>Comment 3</li>');