townivan

<div>
    <button type="submit" class="btn-fmo">
        btn-fmo
    </button>
</div>

townivan

<fieldset class="fmo-reset-radio-and-checkbox-group">
    <legend class="fmo-reset-control-label">
        Choose one or more available days
    </legend>
    <div class="fmo-reset-block-group">
        <div class="fmo-reset-input-label-container">
            <input type="checkbox" id="cbgroup-1" name="cbgroup1" value="Monday" required />
            <label for="cbgroup-1" class="shim-down-1">Monday</label>
        </div>
        <div class="fmo-reset-input-label-container">

townivan

<fieldset class="fmo-reset-radio-and-checkbox-group">
    <legend class="fmo-reset-control-label">
        Preferred travel mode
    </legend>
    <div class="fmo-reset-block-group">
        <div class="fmo-reset-input-label-container">
            <input type="radio" id="radio-1" name="radiogroup1" value="land" required />
            <label for="radio-1" class="shim-down-1">Land</label>
        </div>

townivan

<div>
    <div class="fmo-reset-stack">
        <p class="fmo-reset-control-label" id="cb2-desc">
            Do you agree?
        </p>
        <div class="fmo-reset-single-checkbox">
            <input type="checkbox" id="cb2" name="IsReady2" required aria-describedby="cb2-desc" />
            <label for="cb2" class="shim-down-1">Yes</label>
        </div>
        <p class="fmo-reset-validation-message" role="alert">

townivan

<div>
    <div class="fmo-reset-stack">
        <div class="fmo-reset-single-checkbox">
            <input type="checkbox" id="isReadyCB" name="IsReady1" required />
            <label for="isReadyCB" class="shim-down-1">I am ready</label>
        </div>
        <p class="fmo-reset-validation-message" role="alert">
            <span aria-hidden="true">&otimes;</span>
            This checkbox is required.
        </p>

townivan

<div>
    <label for="favoriteColor" class="fmo-reset-control-label">
        FavColor
    </label>
    <div>
        <select id="favoriteColor" name="FavColor" required aria-invalid="false">
            <option value="">Select a color</option>
            <option value="Red">Red</option>
            <option value="Green">Green</option>
            <option value="Blue">Blue</option>

townivan

<div>
    <label for="firstname" class="fmo-reset-control-label">
        FirstName
    </label>
    <div>
        <input type="text" id="firstname" name="FirstName" spellcheck="false" required />
        <p class="fmo-reset-validation-message" role="alert">
            <span aria-hidden="true">&otimes;</span>
            FirstName is required.
        </p>

townivan

<form class="fmo-reset" method="post" novalidate>
</form>

townivan

/*
    A. Acoustic "event" tracking
    This is used to update the DOM of a button or link with an Acoustic web tracking click event.

    This script uses the url of a button/link to target and tag it.  Each object in the "matches" array represents a url that will be tracked with a particular "nameValue" and "typeValue".  This script will tag all buttons/links that have a substring that matches the "urlfragment" value.

    If you want to track multiple buttons or links, create an object for each unique url.

    - urlfragment: part of a button/link url that will uniquely match only the button/link that you want to track.
    - nameValue: a string provided by Digital Marketing than Acoustic will use to track the web event.

townivan

Events bubble by default. So the difference between the two is:

target is the element that triggered the event (e.g., the user clicked on)
currentTarget is the element that the event listener is attached to.

source: https://stackoverflow.com/a/10086501/1735394