JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<ul id="Steps">
    <li><a href="#FormSignup_section1">Step 1</a></li>
    <li><a href="#FormSignup_section2">Step 2</a></li>
    <li><a href="#FormSignup_section3">Step 3</a></li>
    <li><a href="#FormSignup_section4">Step 4</a></li>
</ul>
<form class="Form Form--signup" id="FormSignup">
    <fieldset id="FormSignup_section1" class="Form_section js-active">
        <h3>Step 1</h3>
        <div class="Form_field">
            <label>Text Input <abbr title="Required">*</abbr></label>
            <div class="Form_input">
                <input type="text" name="text1" placeholder="Text Input" required>
            </div>
        </div>
        <div class="Form_field">
            <label>Text Input</label>
            <div class="Form_input">
                <input type="text" name="text2" placeholder="Text Input">
            </div>
        </div>
    </fieldset>
    <fieldset id="FormSignup_section2" class="Form_section">
        <h3>Step 2</h3>
        <div class="Form_field">
            <label>Text Input <abbr title="Required">*</abbr></label>
            <div class="Form_input">
                <input type="text" name="text3" placeholder="Text Input" required>
            </div>
        </div>
        <div class="Form_field">
            <label>Text Input</label>
            <div class="Form_input">
                <input type="text" name="text4" placeholder="Text Input">
            </div>
        </div>
    </fieldset>
    <fieldset id="FormSignup_section3" class="Form_section">
        <h3>Step 3</h3>
        <div class="Form_field">
            <label>Text Input <abbr title="Required">*</abbr></label>
            <div class="Form_input">
                <input type="text" name="text5" placeholder="Text Input" required>
            </div>
        </div>
        <div class="Form_field">
            <label>Text Input</label>
            <div...

SCSS

li {
    display: inline-block;
}

.Form_section {
    display: none;
    &.js-active {
        display: block;
    }
}

JavaScript

var stepLink = $('#Steps a');
var form = $('#FormSignup');
var btnSave = $('#FormSignup_submit');
var isValid = form.valid();

stepLink.on('click', function(e) {
    var url = $(this).attr('href');
    e.preventDefault();
    form.find(url).addClass('js-active').siblings('.Form_section').removeClass('js-active');
});

form.validate();
btnSave.on('click', function() {
    if (!isValid) {
        form[0].submit();
    }
});