How can I check if 2 Contact Form 7 checkbox inputs are checked or not, with the use of Jquery?

Question

To begin with this is my HTML:

<p>
    <span class="wpcf7-form-control-wrap checkbox-770">
        <span class="wpcf7-form-control wpcf7-checkbox" id="Personal">
            <span class="wpcf7-list-item first last">
            <label>
                <input type="checkbox" name="checkbox-770[]" value="buisness">
                    <span class="wpcf7-list-item-label">buisness
                    </span>
            </label>
            </span>
        </span>
    </span>
<br>
    <span class="wpcf7-form-control-wrap checkbox-771">
        <span class="wpcf7-form-control wpcf7-checkbox" id="buisness">
            <span class="wpcf7-list-item first last">
            <label>
                <input type="checkbox" name="checkbox-771[]" value="Personal">
                    <span class="wpcf7-list-item-label">Personal
                    </span>
            </label>
            </span>
        </span>
    </span>
</p>

And I want to simply check if those 2 checkbox inputs are checked or not, with 2 seperate if statements using Jquery.

Jquery (that I tried so far):

document.addEventListener( 'wpcf7mailsent', function( event ) {
        jQuery(function($) {
        if ($('#Personal > input').is(':checked')) {
            alert('dataLayer Business Pushed!');
        } else {
            alert('If statement did not work!');
        }
        if ($('#buisness > input').is(':checked')) {
            alert('dataLayer Personal Pushed!');
        }
    });
}, false );

The Jquery code above has 2 special lines ( the first and last lines ) that are related to Contact form 7 (a plugin for wordpress) and their purpose is to add an Event listener which in this case will excecute whatever I have inside the Event Listener's brackets upon submitting a form. Note that This code runs error free, and It returns the alert() command I have nested inside the else statement.

Question: What am I typping incorrectly in my Jquery code, and how can I check the checkboxes using Jquery based on the HTML I written above?

Answer 1

To access the form data on wpcf7mailsent event, you have to use event.detail.inputs

<script>document.addEventListener( 'wpcf7submit', function( event ) {
        let inputs = event.detail.inputs;
        for ( let i = 0; i < inputs.length; i++ ) {
            if ( 'checkbox-770[]' == inputs[i].name ) {
                alert( 'checkbox 770 is checked' );
            } else if ('checkbox-771[]' === inputs[i].name ){
                alert( 'checkbox 771 is checked' );
            }
        }
    }, false );
</script>