JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <div class="form-set">
        <form>
          <h4>
            Form Set 1
          </h4>
          <div class="form-group">
            <label for="exampleInputEmail1">Email address</label>
            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email" autofocus="autofocus">
            <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
          </div>
          <div class="form-group">
            <label for="exampleInputPassword1">Password</label>
            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
          </div>
          <div class="form-group form-check">
            <input type="checkbox" class="form-check-input" id="exampleCheck1">
            <label class="form-check-label" for="exampleCheck1">Check me out</label>
          </div>
          <button type="submit" class="btn btn-primary next">Next Step</button>
        </form>

        <form class= "form-2" style="display:none">
          <h4>
            Form Set 2
          </h4>
          <div class="form-group">
            <label for="exampleInputEmail1">Email address</label>
            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            <small id="emailHelp" class="form-text text-muted">We'll never share your email...

CSS

.signup__forms__content {

            p {
                font-size: 12px;
                margin-bottom: 0.8rem;
            }

            .signup__forms__step {
                font-size: 12px;
                color: $gray-900;
                margin: 0 0 6px 0;
            }

            .signup__account__type {

                .signup__account {
                    border: 1px solid $gray-800;
                    padding: 12px 15px;
                    border-radius: 0;
                    margin-bottom: 10px;
                    cursor: pointer;
                    transition: 0.2s;

                    img {
                        width: 40px;
                    }

                    .signup__account__details {
                        display: inline-block;
                        vertical-align: -moz-middle-with-baseline;
                        vertical-align: -webkit-baseline-middle;
                        margin-left: 15px;
                        font-size: 18px;
                        font-weight: 400;

                        h5 {
                            font-size: 16px;
                        }
                    }

                    &:hover {
                        border-color: $gray-600;
                    }

                    &.active {
                        border: 1px solid $blue;
                        box-shadow: rgba($blue, 0.12) 0px 2px 5px;
                    }

                    .forms__radio {
                        display: inline-block;
                        vertical-align: super;
                        margin-right: 2px;
                    }
                }
            }
        }
   
.form-2,.form-3{
    animation: fadeIn 0.5s ease-out;
    
}
@keyframes fadeIn {
    0% {
        opacity: 0;
        position: relative;
        left: 80px;
    }

    100% {
        opacity: 1;
        position: relative;
        left: 0px;
    }
}

JavaScript

$(document).ready(function() {

  $(".form-set form:not(:first-child)").each(function(e) {
    if (e != 0)
      $(this).hide();
  });

  $(".next").click(function() {
    if ($(".form-set form:visible").next().length != 0)
      $(".form-set form:visible").next().show().prev().hide();
    else {
      $(".form-set form:visible").hide();
      $(".form-set form:first").show();
    }
    return false;
  });
});