Javascript 如何选择已单击复选框的值？

我有四个复选框。根据选中（或未选中）的复选框，我需要将css类

添加到任何特定的div中，该div的类为
筛选结果
，并包含与选中复选框的值匹配的
类
。（这是为了显示/隐藏搜索结果，因此选中/取消选中这些框将显示/隐藏具有相应类的各种搜索结果。）

我可以使用
id
s编写四个几乎相同的jquery函数，除了
id
s，或者我可以使用变量编写一个jquery函数。出于显而易见的原因，我宁愿只写一篇。我不熟悉jQuery、JavaScript、PHP等，所以我希望我的错误在这里是非常基本的

这是HTML/PHP：

<!-- HTML for the checkboxes -->
<label>
   <input type="checkbox" class="filterBox" value="devotion" id="toggleDevotion" checked/> Devotions
</label>
<label>
   <input type="checkbox" class="filterBox" value="blog" id="toggleBlog" checked/> Blog Posts
</label>
<label>
   <input type="checkbox" class="filterBox" value="product" id="toggleProduct" checked/> Products
</label>
<label>
   <input type="checkbox" class="filterBox" value="program" id="toggleProgram" checked/> Programs
</label>

<!-- HTML/PHP for the wordpress search results -->
<div class="rowSectionInner results-container">
   <?php if (have_posts() && strlen(trim(get_search_query())) != 0 ) { ?>
         <?php while (have_posts()) { the_post(); ?>
            <?php // Render a separation line. ?>
            <?php if ($hasLoopedOnce) { ?>
            <?php } $hasLoopedOnce = true; ?>
            <?php // Render the search result. ?>
            <div class="row justify-content-md-center filter-result">
               <div class="col-md-7">
                  <article>
                     . . . . . . . . . . . . . . .
                     <div class="siteSearch_date previewDate">
                        <?php echo get_the_date(); ?> <?php echo rename_post_types(get_post_type()); ?>
                     </div>
                     . . . . . . . . . . . . . . .
                  </article>
               </div>
            </div>
         <?php } ?>
   <?php } ?>
</div>

这是我编写的jQuery，试图将主显示/隐藏切换组合成一个函数：

$(".filterBox").click(function() {  
   var $lemon = $(this).val();

   if( $(this).is(':checked')) {
      $(".siteSearch_date:contains($lemon)").closest('.filter-result').removeClass('remove');
   } else {
      $(".siteSearch_date:contains($lemon)").closest('.filter-result').addClass('remove');
   }
});

我希望它能从类为
.filter result
的divs中应用或删除
remove
类，但我没有从任何地方得到响应，包括控制台。我缺少什么？
选择器的正确语法是：

$(".siteSearch_date:contains('"+$lemon+"')")

编辑---

下面的代码片段应该模拟添加bakground作为示例的代码，这是您想要实现的吗


$（“.filterBox”）。单击（函数（）{
var$lemon=$（this.val（）；
如果（$（this）.is（':checked'））{
$（“.siteSearch_date:包含（“+$lemon+”））”）。最近（“.filter result”）。removeClass（'remove'）；
}else{$（“.siteSearch_date:contains（“+$lemon+”）））。最近（“.filter result”）。addClass（'remove'）；
}
});
。删除{
背景色：红色；
}

奉献
博客帖子
产品
程序
. . . . . . . . . . . . . . .
产品
. . . . . . . . . . . . . . .
. . . . . . . . . . . . . . .
博客
. . . . . . . . . . . . . . .
. . . . . . . . . . . . . . .
产品
. . . . . . . . . . . . . . .
. . . . . . . . . . . . . . .
程序
. . . . . . . . . . . . . . .
. . . . . . . . . . . . . . .
奉献
. . . . . . . . . . . . . . .
我看不到任何变化。控制台中仍然没有变化，也没有任何内容。
console.log（$lemon）的输出记录了我需要的确切单词，不过。我似乎无法将输出输入到函数中。
$(".siteSearch_date:contains('"+$lemon+"')")