How to properly organize step-by-step form validation?

Question

JavaScript

There is a step-by-step form like this.

<form action="#">

        <section>
            <input type="text">
            <input type="text">
            <input type="text">
        </section>

        <section>
            <input type="text">
            <input type="text">
            <input type="text">
        </section>

        <section>
            <input type="text">
            <input type="text">
            <input type="text">
        </section>

        <a href="#">next</a>
        
        <button>Send</button>
        
    </form>

Only one section is always open. Those. clicking on "Next" changes the active section.
How to organize data validation not for the entire form immediately upon submission, but separately for each section when clicking on "Next"

Answer 1

By clicking the "Next" button, validate only the open section

Answer 2

Here is the algorithm: -
Get the current section(!!!)
- Check it - Validate it
- Open
the next one
- Block the initial section