我想在Coldfusion应用程序上使用JQuery来显示/隐藏div元素，且div中的复选框处于选中/未选中状态。

基本上，在一个视图中，我显示了多个div元素，每个div内也有更多div，这些内部div之一包含一个输入类型复选框，可以选中或不选中。

在该视图中，我还有三个按钮“有效，无效，全部”。当点击Active时，我想显示所有div复选框都已选中的div元素，不显示未选中的复选框，以及当点击Inactive时的其他方法。

<div class="btn-group ">
  <button id="actives" type="button">Actives</button>
  <button id="inactives" type="button">Inactives</button>
  <button id="all" type="button">All</button>
</div>

<div id="apiDiv">
  <cfloop array="#apis#" index="api">
    <div class="card card-found">
      <div class="card-header">
        <cfif Len(api.iconClass)>
          <i class="fa fa-fw #api.iconClass#"></i>
        </cfif>
        #structKeyExists( api, "name" ) ? api.name : api.id#
      </div>
      <div class="card-body">
        <p>#api.description#</p>
      </div>
      <div class="card-button">
        <input class="#inputClass# ace ace-switch ace-switch-3" name="#inputName#" id="#inputId#-#api.id#" type="checkbox"  value="#HtmlEditFormat( api.id )#"<cfif ListFindNoCase( value, api.id )> checked="checked"</cfif> tabindex="#getNextTabIndex()#">
        <span class="lbl"></span>
      </div>
    </div>
  </cfloop>
</div>

我根本不是JQuery的专家。我唯一要做的是接下来的事情，我不知道这是否是一个好的开始：

$("#actives").click(function (e) {
  $("#apiDiv .card").filter(function() {
    <!--- code here --->
  });
});

有人可以帮我吗？在此先多谢！