How can I define something like OR in jQuery's selector?

Question

Here is my current code:

$(".close_btn").click(function(e) {
        $(".box1").fadeOut(100);
        $(".box2").fadeOut(100);
});

As you see, currently, when you click on .close_btn, both .box1 and .box2 will be hidden. Now I want to use $(this) and .closest() to hide just one box (the parent of clicked .close_btn, there are two .close_btn). I mean I want something like this:

$(".close_btn").click(function(e) {
        $(this).closest(".box1" OR ".box2").fadeOut(100);
});

Is doing that possible?

`$(this).closest(".box1, .box2")` ? – Karl-André Gagnon Feb 02 '17 at 14:50 — Karl-André Gagnon, Feb 02 '17 at 14:50
@Karl-AndréGagnon Yes .. great. thank you – stack Feb 02 '17 at 14:51 — stack, Feb 02 '17 at 14:51

score 1 · Accepted Answer · answered Feb 02 '17 at 14:51

You can just use a comma to separate multiple selectors:

$(".close_btn").click(function(e) {
        $(this).closest(".box2, .box1").fadeOut(100);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box1">
  <button class="close_btn">Close</button>
</div>

<div class="box2">
  <button class="close_btn">Close</button>
</div>

How can I define something like OR in jQuery's selector?

1 Answers1