jquery - 当一侧打开时关闭其他

Question

我有这个代码：

JS：

    $(document).ready(function(){
       $('nav ul li').click(function () {
          $('aside.' + this.className).toggleClass('opened');
       });
    });

HTML：

<nav>
 <ul>
    <li class="index">Home</li>
    <li class="index2">some text</li>
</ul>
  </nav>

  <aside class="index">
    <div class="picture"></div>
    <h2>Lorem Ipsum</h2>
    <p>Lorem ipsum dolor sit amet</p>
  </aside>

  <aside class="index2">
    <div class="picture"></div>
    <h2>Lorem Ipsum 2</h2>
    <p>Lorem ipsum dolor sit amet 2</p>
  </aside>

现在我希望当我打开 One Aside 时所有其他的都被关闭？？？

Answer 1

$('aside').not('.' + this.className).removeClass('opened');
$('aside.' + this.className).toggleClass('opened');

Answer 2

$(document).ready(function(){
   $('nav ul li').click(function () {
      $('aside').removeClass('opened');
      //just do the 1st one at index `0`
      $('aside.' + this.className).eq(0).toggleClass('opened'); 
   });
});

Answer 3

$('aside').click(function(){
    $('aside').not(this).removeClass('opened');
});