jQuery: фильтрация галереи с несколькими категориями / поиск строки в значении данных

Question

Я хочу создать галерею портфолио с параметрами фильтрации. Каждое изображение в галерее может принадлежать нескольким категориям фильтрации. Как мне нужно изменить код, чтобы проверить, используется ли строка (одна из категорий) внутри HTML? Так что в конце элемент отображается, когда одна из категорий, к которой он принадлежит, выбрана, даже если к ней прикреплено несколько категорий?

Я уверен в том, как проверить на равенство, но не какизмените код, чтобы он проверял несколько категорий.

  <ul class="nav nav-pills nav-fill justify-content-center gallery-filters">
                <li role="presentation" class="nav-item active" gallery-filter="all"><a href="#" class="nav-link"  data-toggle="pill" >Alle</a></li>
                 <li role="presentation" class="nav-item" gallery-filter="design"><a href="#" class="nav-link"  data-toggle="pill" >Design</a></li>
                <li role="presentation" class="nav-item" gallery-filter="digital"><a href="#" class="nav-link"  data-toggle="pill" >Digital</a></li>
                <li role="presentation" class="nav-item" gallery-filter="print"><a href="#" class="nav-link"  data-toggle="pill" >Print</a></li>
                <li role="presentation" class="nav-item" gallery-filter="cd"><a href="#" class="nav-link"  data-toggle="pill" >Corporate design</a></li>
                <li role="presentation" class="nav-item" gallery-filter="Logo"><a href="#" class="nav-link"  data-toggle="pill" >Logo</a></li>
                 <li role="presentation" class="nav-item" gallery-filter="text"><a href="#" class="nav-link"  data-toggle="pill" >Text</a></li>
                <li role="presentation" class="nav-item" gallery-filter="marketing"><a href="#" class="nav-link"  data-toggle="pill" >Marketing</a></li>
            </ul>
            
             <div class="col-sm-4 gallery-img-holder shadow" filter-category="cd print logo design">
           <a href="/2019/10/22/smith-and-taylor/">
               <img src="sm-pfthumb.jpg" class="thumbnail"></a>
        </div>
        <div class="col-sm-4  p-3 gallery-img-holder shadow" filter-category="print design">
           <img src="kirche-pfthumb.jpg" class="thumbnail">
        </div>

jQuery('document').ready( function($) {
    $('.gallery-filters li').on('click', function() {
        $('.gallery-filters li').removeClass('active');
        $(this).addClass('active');
        filter = $(this).attr('gallery-filter');

        $('.gallery-img-holder').each( function() {
            if (filter == 'all') {
                $(this).fadeIn(); 
            } else {
                $(this).hide();
                if ($(this).attr('filter-category') == filter) {
                    $(this).fadeIn();
                }
            }
        });
    });
});

В настоящее время изображения с более чем одной прикрепленной категорией просто не отображаются.