Search and hide divs

Search and hide divs

Hello,

how can i hide and filter all FAQs, that not contain the search term "Auto".

I want to hide both the panel-heading and the panel-body and tried so far:

     $('.panel-body:not(:contains(' + s + '))').parents("div.panel-heading").hide();
         
        $('.panel-body:not(:contains(' + s + '))').hide();
        $('.panel-body:contains(' + s + ')').show();


  1.   <!-- FAQ1 -->
                            <div class="panel panel-default panel-faq">
                                <div class="panel-heading">
                                    <a data-toggle="collapse" data-parent="#accordion-cat-1" href="#faq-cat-1-sub-1">
                                        <h4 class="panel-title">
                                            FAQ Item 1 Category #1
                                            <span class="pull-right"><i class="glyphicon glyphicon-plus"></i></span>
                                        </h4>
                                    </a>
                                </div>
                                <div id="faq-cat-1-sub-1" class="panel-collapse collapse">
                                    <div class="panel-body">
                                        test Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard
                                    </div>
                                </div>
                            </div>
                           
                            <!-- FAQ 2 -->
                            <div class="panel panel-default panel-faq">
                                <div class="panel-heading">
                                    <a data-toggle="collapse" data-parent="#accordion-cat-1" href="#faq-cat-1-sub-2">
                                        <h4 class="panel-title">
                                            FAQ Item 2 Category #1
                                            <span class="pull-right"><i class="glyphicon glyphicon-plus"></i></span>
                                        </h4>
                                    </a>
                                </div>
                                <div id="faq-cat-1-sub-2" class="panel-collapse collapse">
                                    <div class="panel-body">
                                        Auto Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard
                                    </div>
                                </div>
                            </div>