Detect click event or update on a checkbox

Hello,

We are using WooCommerce AJAX Products Filter on our website. Is there a way to detect a click event or detect change on the checkbox?

We have several checkbox filters that looks like below:

<div class="bapf_body">
  <ul>
    <li>
      <input data-name="$10 - $25" id="bapf_10_10*25" type="checkbox" value="10-25">
      <label for="bapf_10_10*25">$10 - $25</label>
    </li>
    <li>
      <input data-name="$4 - $15" id="bapf_10_4*15" type="checkbox" value="4-15"> 
      <label for="bapf_10_4*15">$4 - $15</label>
    </li>
  </ul>
</div>

I tried the jQuery code below to detect a click event on a checkbox or detect a change on a element via DOMSubtreeModified but it doesn’t work.

jQuery(".bapf_body > ul > li > input[type='checkbox']").on("click", function(e) {
  console.log("EVENT TRIGGER");
});

jQuery(".bapf_body > ul > li").on("DOMSubtreeModified", function(){
  console.log("element updated");
});

Do you have any ideas how to do what I want to achieve? Any help is greatly appreciated. Thank you