Button with 2 states

<div class='u-wrap'>

  <div class="btn-prompt js-prompt" data-state="is-closed">

    <button class="btn-prompt__trigger u-fl" type="button" title='.btn-prompt'>

    Delete Something

    </button>

    <span class="btn-prompt__message">Are you sure?</span>

    <button class="btn-prompt__accept js-prompt-yes" type="button">

    Yes

    </button>

    <button class="btn-prompt__reject" type="button">

    No

    </button>

  </div>

  <div class="btn-prompt btn-prompt--alt u-fr js-prompt" data-state="is-closed">

    <button class="btn-prompt__trigger u-fl" type="button"  title='.btn-prompt.btn-prompt--alt'>

    Delete Something (v2)

    </button>

    <span class="btn-prompt__message">Are you sure?</span>

    <button class="btn-prompt__accept js-prompt-yes" type="button">

    Yes

    </button>

    <button class="btn-prompt__reject" type="button">

    No

    </button>

  </div>

</div>