JQuery删除父列表项

Question

我有以下标记：

 <ul class="media-list">
    <li class="media post">
       <div class="media-left">
           <a href="#"></a>
       </div>
       <div class="media-body">
          <div class="post-content">
               <p></p>
          </div>
          <div class="post-actions clearfix">
             <ul class="list-unstyled list-inline">
               <li>
                  <a class="js-delete-post" data-post-id="24" href="#">
                    Delete
                  </a>
               </li>
             </ul>
         </div>
      </div>
   </li>
   <li class="media post">
      ...
   </li>
</ul>

当我点击js-delete-post锚点时，我想删除带有类＆＃34;媒体帖子＆＃34;的父li。

以下Jquery只是遍历一个级别并删除了js-delete-class的li。如何遍历其他级别以删除帖子。

$(".js-delete-post").click(function (e) {
    var a = $(this); // "this" is the <a>

     a.parents("li").fadeOut(function () {
                $(this).remove();
     });
 });

Answer 1

您希望closest代替parents，然后按类选择它。

a.closest("li.media.post").fadeOut(function() {
    $(this).remove();
});