Facet - Multiple

<ul class="u-remove-bullets">
                    <li class="c-facet">
                    <button class="c-facet__toggle" aria-expanded="false" aria-controls="products">
                    Products<svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--chevron-down">
                    <use xlink:href="/static/svg/sprite.svg#chevron-down"></use>
                  </svg>
                </button>
                <ul id="products" class="c-facet__list">
                  <li>
                    <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-lab" value="Mastersizer 3000+ Lab"     />
                    <label for="mastersizer-3000-lab">Mastersizer 3000+ Lab (20)</label>
                  </li>
                  <li>
                    <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-pro" value="Mastersizer 3000+ Pro"     />
                    <label for="mastersizer-3000-pro">Mastersizer 3000+ Pro (5)</label>
                  </li>
                  <li>
                    <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-ultra" value="Mastersizer 3000+ Ultra"     />
                    <label for="mastersizer-3000-ultra">Mastersizer 3000+ Ultra (1)</label>
                  </li>
                </ul>
              </li>
              <li class="c-facet">
              <button class="c-facet__toggle" aria-expanded="false" aria-controls="technologies">
              Technologies<svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--chevron-down">
              <use xlink:href="/static/svg/sprite.svg#chevron-down"></use>
            </svg>
          </button>
          <ul id="technologies" class="c-facet__list">
            <li>
              <input type="checkbox" class="c-checkbox" name="technologies" id="borate-fusion" value="Borate fusion"     />
              <label for="borate-fusion">Borate fusion (16)</label>
            </li>
            <li>
              <input type="checkbox" class="c-checkbox" name="technologies" id="differential-scanning-calorimetry" value="Differential Scanning Calorimetry (DSC)"     />
              <label for="differential-scanning-calorimetry">Differential Scanning Calorimetry (DSC) (18)</label>
            </li>
            <li>
              <input type="checkbox" class="c-checkbox" name="technologies" id="dynamic-light-scattering" value="Dynamic Light Scattering"     />
              <label for="dynamic-light-scattering">Dynamic Light Scattering (72)</label>
            </li>
          </ul>
        </li>
        <li class="c-facet">
        <button class="c-facet__toggle" aria-expanded="false" aria-controls="measurementTypes">
        Measurement types<svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--chevron-down">
        <use xlink:href="/static/svg/sprite.svg#chevron-down"></use>
      </svg>
    </button>
    <ul id="measurementTypes" class="c-facet__list">
      <li>
        <input type="checkbox" class="c-checkbox" name="measurementTypes" id="structure-imaging" value="3D structure / imaging"     />
        <label for="structure-imaging">3D structure / imaging (2)</label>
      </li>
      <li>
        <input type="checkbox" class="c-checkbox" name="measurementTypes" id="binding-affinity" value="Binding affinity"     />
        <label for="binding-affinity">Binding affinity (10)</label>
      </li>
      <li>
        <input type="checkbox" class="c-checkbox" name="measurementTypes" id="binding-kinetics" value="Binding kinetics"     />
        <label for="binding-kinetics">Binding kinetics (11)</label>
      </li>
    </ul>
  </li>
</ul>

{
  "facets": [
    {
      "id": "products",
      "heading": "Products",
      "options": [
        {
          "id": "mastersizer-3000-lab",
          "value": "Mastersizer 3000+ Lab",
          "label": "Mastersizer 3000+ Lab (20)"
        },
        {
          "id": "mastersizer-3000-pro",
          "value": "Mastersizer 3000+ Pro",
          "label": "Mastersizer 3000+ Pro (5)"
        },
        {
          "id": "mastersizer-3000-ultra",
          "value": "Mastersizer 3000+ Ultra",
          "label": "Mastersizer 3000+ Ultra (1)"
        }
      ]
    },
    {
      "id": "technologies",
      "heading": "Technologies",
      "options": [
        {
          "id": "borate-fusion",
          "value": "Borate fusion",
          "label": "Borate fusion (16)"
        },
        {
          "id": "differential-scanning-calorimetry",
          "value": "Differential Scanning Calorimetry (DSC)",
          "label": "Differential Scanning Calorimetry (DSC) (18)"
        },
        {
          "id": "dynamic-light-scattering",
          "value": "Dynamic Light Scattering",
          "label": "Dynamic Light Scattering (72)"
        }
      ]
    },
    {
      "id": "measurementTypes",
      "heading": "Measurement types",
      "options": [
        {
          "id": "structure-imaging",
          "value": "3D structure / imaging",
          "label": "3D structure / imaging (2)"
        },
        {
          "id": "binding-affinity",
          "value": "Binding affinity",
          "label": "Binding affinity (10)"
        },
        {
          "id": "binding-kinetics",
          "value": "Binding kinetics",
          "label": "Binding kinetics (11)"
        }
      ]
    }
  ]
}