Adding form success messages

In the previous example, when the loading had finished after form submission, the text of the submit button was replaced. Now we want to also add form success messages below our forms when loading has finished.

We will use the alert component with the $success color for our success message, and we will place it inside the collapse component, so it can be displayed with a vertical transition. To achieve this, first, we will add the following markup to our forms after the submit and reset buttons and just before the closing </form> tag, again using the newsletter form as an example:

part-2/chapter-9/website/index.html

<div class="collapse mt-3" id="newsletterConfirmation">
  <div class="alert alert-success">
    <h3 class="alert-heading h4">Subscribed!</h3>
    <p class="mb-0">Lorem ipsum dolor sit amet, consectetur...