jQuery serialize multiple checkboxes multiple forms

I am trying to serialize all checked checkbox values across multiple forms on a single page. When I serialize the data, I console log the name of the checkbox plus the values that have been checked. If only one box has been checked, the console will display a name-value pair like this: 'one:Flat'. If a checkbox has multiple boxes checked, the console will display a name-value pair like this: 'one:Flat, Slope'.

I have it working, however, I am trying to find a more efficient way to look through all of the checked checkboxes that may be present throughout multiple forms.

Here is a snippet of a page that has two forms with checkboxes in each form.

<form id="formOne">
<h1>Form one</h1>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" value="Flat" name="one">
Flat
</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" value="Slope" name="one">
Slope
</label>
</div>
</form>
<br>
<form id="formTwo">
<h6>Form two</h6>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" value="Strong Winds"
name="two">
Strong Winds
</label>
</div>
<div class="form-check form-check-inline">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" value="Ice"
name="two">
Ice
</label>
</div>
</form>


<br>
<input id="one_checkboxes" type="hidden" name="one">
<input id="two_checkboxes" type="hidden" name="two">
<div class="text-center">
<button id="clickMe" type="button" class="btn btn-primary">click me</button>
</div>

Once the user clicks the button, I serialize the data and put into a JSON object. Then iterate over each object and see if there is any value related to the input name that was grabbed. If there is nothing there, skip over it and look at the next item.

I check to see if the name matches a name a checkbox, if it does, grab the joined array values and pair that value with the name and say that checkbox is done. If the checkbox pops up again, which will happen if multiple values have been checked, we see we have already grabbed the values and skip over the remaining instances of the checkbox. Same thing happens again if we see another series of checkboxes, etc.

$('#clickMe').click(function () {

        var oneArray = [];
        var twoArray = [];

        var oneTouched = 0;
        var twoTouched = 0;

        $('input:checked[name="one"]').each(function () {
            oneArray.push($(this).val());
        });

        $('input:checked[name="two"]').each(function () {
            twoArray.push($(this).val());
        });


        $('#one_checkboxes').val(oneArray.join(', '));
        $('#two_checkboxes').val(twoArray.join(', '));


        var formData = JSON.parse(JSON.stringify(jQuery('form').serializeArray()));
        $.each(formData, function () {
            // if any of the inputs through the forms have no input, ignore that name-value pair
            // move onto the next one to add to the report generated
            if (this.value === "") {
                return true;
            }

            if (this.name === "one" && oneTouched === 0) {
                this.value = $('#one_checkboxes').val();
                oneTouched = 1;
            }
            else if (this.name === "one" && oneTouched === 1) {
                return true;
            }

            else if (this.name === "two" && twoTouched === 0) {
                this.value = $('#two_checkboxes').val();
                twoTouched = 1;
            }
            else if (this.name === "two" && twoTouched === 1) {
                return true;
            }

            console.log(this.name + ': ' + this.value);
        });
    });

The page I am working on will have multiple forms exactly like these and sometimes multiple checkbox series in each form. What is the best way to approach grabbing all the checked checkbox values through multiple forms with multiple checkboxes?

For a full example: http://ift.tt/2h0i7EW

using jQuery 3.2.1 and Bootstrap 4-beta 2