javascript - 使用 jQuery 在点击时隐藏 parent 的 parent 的 div

Question

我需要点击 span.opn，然后切换(隐藏/显示).body div

<li class="panel">

  <div class="head">

    <span class="del"></span>
    <span class="opn"></span>

  </div>

  <div class="body">

   <!-- Something -->

  </div>

</li>

JS

//需要更改.opn 类或添加一些类

//需要切换(隐藏/显示)< div class="body">

jQuery('.opn').on('click', function() {

  jQuery(this).closest('.body').toggle();

});

//需要 ( delete/remove ) < li class="apanel"> 当点击这个 ( .del )

jQuery('.del').on('click', function() {

  jQuery('li.panel').remove();

});

谢谢

Answer 1

应该这样做

jQuery('.opn').on('click', function() {
  // I want to Change .opn Class or add some class
  $(this).addClass('smoe-class');

  // I want to toglle ( hide/Show ) <div class="body">
  $(this).parent().next('.body').toggle();
});

jQuery('.del').on('click', function() {
  // I want to delete <li> when click this jQuery('.del');    
  $(this).closest('li.panel').remove();
});