@momentum-ui/react-collaboration/scss/components/input/examples/clear.html

Cisco Momentum UI Framework for React Collaboration Applications

<div class="md-input-container small-12 columns">
  <label class="md-label md-input__label" for="clearValueInput1">
    <span>Input with clear</span>
  </label>
  <div class="md-input__wrapper">
    <input
      class="md-input md-input--after md-active md-dirty"
      tabindex="0"
      type="text"
      id="clearValueInput1"
      name="clearValueInput1"
      value="Press or click the clear icon to clear this input"
    />
    <span class="md-input__after">
      <button
        class="md-button md-button--36 md-button--icon md-input__icon-clear"
        alt="clear input"
        type="button"
        aria-label="clear input"
        tabindex="0"
      >
        <span class="md-button__children" style="opacity: 1;">
          <i class="md-icon icon icon-clear-active_16" style="font-size: 16px;">
            </i>
        </span>
      </button>
    </span>
  </div>
</div>