Скрыть конкретный div, если все элементы имеют один и тот же класс

Question

У меня на странице множество одинаковых элементов. Все эти элементы имеют следующую структуру:

<div id="9p" class="col s12 m6 l2 cardmaion globalcardclass">
    <div class="card 9p">
        <div class="card-content ">
            <div class="row card-row">
                <!-- a bunch of divs -->

                <!-- a line of a card -->
                <a data-category="here" class="hidden">
                    <div style="border-top:2px dotted gray;font-size:18px;background:ivory;margin-top:1px;"
                        id="belanimation" class="card-line waves-effect waves-green">
                        Some random text goes here <span class="card-line-q">&nbsp; x 1</span><span
                            class="modspan  "></span></div>
                </a>
                <!-- a line of a card -->
                <a data-category="here" class="hidden">
                    <div style="border-top:2px dotted gray;font-size:18px;background:ivory;margin-top:1px;"
                        id="belanimation" class="card-line waves-effect waves-green">
                        Some random text goes here <span class="card-line-q">&nbsp; x 2</span><span
                            class="modspan  "></span></div>
                </a>
                <!-- a line of a card -->
                <a data-category="here" class="hidden">
                    <div style="border-top:2px dotted gray;font-size:18px;background:ivory;margin-top:1px;"
                        id="belanimation" class="card-line waves-effect waves-green">
                        Some random text goes here <span class="card-line-q">&nbsp; x 2</span><span
                            class="modspan  "></span></div>
                </a>
            </div>
        </div>
    </div>
</div>

Все cards (пример выше) имеют общий class = globalcardclass (это единственный способ отслеживать эти «элементы карты»)

Все строки в карточке могут быть (или нет!) содержит class = hidden

Итак, я хочу, чтобы скрипт скрыл всю карточку, если все <a> элементы (lines) имеют класс = скрытый

Если один или два элемента (lines) не имеют класса hidden - карта отображается.

Мне нужно добавить еще один класс hide к определенному card, если все его дочерние элементы имеют класс hidden .

Вот я что-то пробую, но ничего не получается. Сложная часть ... когда элемент card получает элементы (lines) с классом hidden , эта карта должна появиться снова ...

Пожалуйста, помогите.

<script>
    $(document).ready(function () {
        function FilterHere() {
            var emptyCounter = 0
            jQuery(".globalcardclass a").each(function () {
                if ($(this).is('.hidden')) {
                    emptyCounter++
                }
                emptyCounter--
            });
            if (emptyCounter === 0) {
                $(".globalcardclass").hide();
            }
        }
        setTimeout(FilterHere, 2000);
    });
</script>

UPD!

Вот новый способ решения моей проблемы:

jsfiddle.net / q6cekb18

Но тоже не работает ...

UPD 2 (!)

Наконец-то! У меня есть некоторый прогресс!

   $(".globalcardclass").filter(function(){
    return $(this).find(".smoothmaion:visible").length == 0;
}).hide();

Этот код работает ... Все карты скрываются ... Но ...

Карта (.globalcardclass) не отображается вверх, если элемент 'line' (.smoothmaion) снова станет видимым ... Как сделать что-то вроде ... переключателя?

Да ... Я могу:

<script>
  function Filtering()
  {
    $(".globalcardclass").filter(function(){
    return $(this).find(".smoothmaion:visible").length == 0;
}).toggleClass( "hide_hide" )



     };
</script>

Но ... Когда я использую другую кнопку для фильтрации различных типов элементов ... Эта функция «переключения» возвращает этот скрытый элемент, потому что он не изменился, поэтому ... переключение ..

Что делать?