开发者

jQuery - hide if previous element has a particular class

开发者 https://www.devze.com 2022-12-22 01:32 出处:网络
I would like to hide all class=\"csc-content\" where previous sibling is a h4 class=\"faq\". UPDATE Error: I think this is wrong... the previous sibling is not h4. But I hope you get the point that a

I would like to hide all class="csc-content" where previous sibling is a h4 class="faq".

UPDATE Error: I think this is wrong... the previous sibling is not h4. But I hope you get the point that all "answer" shall be hidden if the "question" has the class "faq" /UPDATE

This is the html:

<div id="centerCol-1">
  <div id="c65" class="csc-default normal">
    <div class="csc-header csc-header-n1"><h4 class="faq">FAQ question1</h4></div>
    <div class="csc-content active"><p class="bodytext">Answer1</p></div>
  </div>
  <div id="c67" class="csc-default normal">
    <div class="csc-header csc-header-n2"><h4 class="faq">FAQ question2</h4></div>
    <div class="csc-content active"><p class="bodytext">Answer2</p></div>
  </div>
  <div id="c68" class="csc开发者_开发百科-default normal">
    <div class="csc-header csc-header-n3"><h4>not FAQ</h4></div>
    <div class="csc-content active"><p class="bodytext">Not an answer, just normal content</p></div>
  </div>
</div>

jQuery should be something like:

// find all outer divs with class csc-default in the div centerCol-1
// test if they contain a header div with an h4 class faq
// go to next element and hide it. Error... this should be parents next element?
$("#centerCol-1 .csc-default").find("h4").is(".faq").next(".csc-content").hide();

BR. Anders


You need to use the adjacent selector along with the :has selector, like this:

$('#centerCol-1 .csc-default .csc-header:has(.faq)+.csc-content').hide();

Demo


Hang on, you only want to hide the answer div for each FAQ question? So if the h4 has the class .faq, the div immediately after the parent div gets hidden:

$("#centerCol-1 h4.faq").parent().next("div").hide();


Try this:

$("#centerCol-1 .csc-content").filter(function() {
  return $(this).prev().find(".faq").length > 0;
}).hide();
0

精彩评论

暂无评论...
验证码 换一张
取 消