Jquery - How to select 2 elements with same class name in a document area?

Question

$(".Here").click(function() {
  $(".container p").css("opacity", 1);
  $(".container p").siblings().css("opacity", 0);
  $(".container li").css("opacity", 1);
  $(".container li").siblings().css("opacity", 0);
})

When i click .Here class, then of course p and li, all the tags will have opacity 0.

i want to set 2 tag p and li in the same area like, and i tried this way.

  $(".container p, .container li").css("opacity", 1);
  $(".container p, .container li").siblings().css("opacity", 0);

Is it impossible?

Answer 1

I created a little mockup to test your code, it seems to be working properly:

$(".Here").click(function() {
  //$(".container p").css("opacity", 1);
  //$(".container p").siblings().css("opacity", 0);
  //$(".container li").css("opacity", 1);
  //$(".container li").siblings().css("opacity", 0);
  $(".container p, .container li").css("opacity", 1);
  $(".container p, .container li").siblings().css("opacity", 0);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="Here">Click Me</button>

<div class="container">
   <div class="parent">
      <p>Paragraph element</p>
      <b>Paragraph element Sibling</b>
   </div>
   <ul>
      <li>List item</li>
      <b>List item Sibling</b>
   </ul>
</div>