How to dynamically add group of inputs field in a form of html?

Question

I am creating a form having multiple things and as i am beginner in my front end career I am stuck at this point where my imagination stops working .

So basically i want a form where there must be a qualification tab under which a user can update or insert his/her qualifications

so i want something like this

input box for educationName (school,graduation,post_graduation,others)

input box for year (year of passing)

input box for institude (from where user had pursued education)

a button which can be clicked for again repeating these same input boxes

<div class="row mb-3">
    <div class="col-3">
        <div class="form-group">
            <div>
                <label for="exampleInputEmail1">Name</label>
                <input type="text" class="form-control" name="educationName[]" id="educationName" placeholder="Enter Name">
            </div>
        </div>
    </div>
    <div class=" col-3">
        <div class="form-group">
            <div>
                <label for="exampleInputEmail1">Institute</label>
                <input type="text" class="form-control" name="institute[]" id="institute" placeholder="Enter Institute">
            </div>
        </div>
    </div>
    <div class="col-3">
        <div class="form-group">
            <div>
                <label for="exampleInputEmail1">Year</label>
                <input type="text" class="form-control" name="year[]" id="year" placeholder="Enter Year">
            </div>
        </div>
    </div>
    <div class=" col-3">
        <div class="form-group">
            <div>
                Add More
                <button class="btn btn-success add_button" title="Add field" onclick="appendInput()">Primary</button>
                <!-- <a href="javascript:void(0);" class="add_button" title="Add field"><img src="add-icon.png" /></a> -->
            </div>
        </div>
    </div>
</div>

so i am confused how to do this what i want is if some one inserts these information and press button then below the input boxes same three boxes must appear where user can inserts his/her other qualifications and this process must be continue until user has finished inserting data

can someone explain me if this is possible or not and if it is possible can we do it with jquery or js as I am not using any framework right now

this image is for checking what kind of input box i am talking about