如何在jquery中隐藏和显示所有元素？

Question

我在mypage中有许多相同的div，内容相同：

<div> 
<p class="firstp" id="p1-1" class="hideblock"> default-hide-1 </p>

<p class="secondp" id="p1-2">  default-show-1 </p>
</div>

<div> 
<p class="firstp" id="p2-1" class="hideblock"> default-hide-2 </p>

<p class="secondp" id="p2-2"> default-show-2 </p>
</div>

。     。     

如果我点击p1-2，我想要除了p1-1之外的所有第一个p加入hideblock（对于p1-1删除hideblock）

- 同样的例子：如果点击p2-2，隐藏除p2-1之外的所有第一个p（对于p2-1删除hideblock类）

我试着用这段代码来做：

$(document).ready(function(){
  $("#p2-2").click(function(){
        $(".firstp").removeClass('hideblock').addClass('hideblock');
        $("p2-1").removeClass('hideblock');
        $(".secondp").removeClass('hideblock');
        $(this).addClass('hideblock');             
});
});
    });

}）;

但是有更好的方法吗？

Answer 1

 $(document).ready(function(){

    $("#p1-1, #p2-1").click(function(){      
      $( ".firstp" ).removeClass('hideblock');   
    });

    $("#p1-2").click(function(){
        //where id is not p1-1 and class contains firstp
      $( "p[id!='p1-1'][class~='firstp']").addClass('hideblock');   
    });

    $("#p2-2").click(function(){
        //where id is not p2-1 and class contains firstp
      $( "p[id!='p2-1'][class~='firstp']" ).addClass('hideblock');   
    });

 });