Hide grand-parent class when checkbox is checked

I need to hide the first class below (wfob_wrap) when checkbox (wfob_checkbox) is checked. I tried many ways with no success.

Could anyone help me with this?

Thank you!

<div id="wfob_wrap" class="wfob_wrap_start">
  <div class="wfob_wrapper" data-wfob-id="72396">
    <div class="wfob_bump wfob_clear" data-product-key="wfob_5fb3c4fc409e4" data-wfob-id="72396">
      <div class="wfob_outer">
        <div class="wfob_Box">
          <div class="wfob_bgBox_table no_table">
            <div class="wfob_bgBox_tablecell no_table_cell wfob_check_container">
              <div class="wfob_order_wrap wfob_content_bottom_wrap">
                <div class="wfob_bgBox_table_box">
                  <div class="wfob_bgBox_cell wfob_img_box">
                    <div class="wfob_checkbox_input_wrap">
                      <span class="wfob_bump_checkbox">
                        <input type="checkbox" class="wfob_checkbox wfob_bump_product" checked="">
                      </span>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>