JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<form class="form-horizontal" role="form" method="post">
                <div class="row zirius-form"><!-- Zirius form starts -->
                    
                    <div class="col-md-6 zirius-row"><!-- Left Column start -->
                        <input type="text" name="label[0][left]" class="form-control text-center" id="left1">
                    </div><!-- Left Column ends --><!--
                    
                    --><div class="col-md-2 zirius-row"><!-- Label Column start -->
                        <input type="text" maxlength="32" name="label[0][name]" class="form-control text-center" id="label1">
                        <a href="#" class="btn btn-success btn-xs add-txt">Add More</a>
                    </div><!-- Label Column ends -->
                    
                </div>
<div class="form-group">
            <input type="submit" name="Submit" id="Submit" value="Validate Form" class="btn btn-danger btn-block btn-lg" />
        </div>
</form>

JavaScript

$(".form-horizontal .add-txt").click(function(){
                var no = $(".zirius-form").length + 1;
                var id = $(".zirius-form").length;
                if( 999 < no ) {
                    alert('Stop it!');
                    return false;
                }
                var more_textbox = $('<div class="row zirius-form">' +
                '<div class="col-md-6 zirius-row"><!-- Left Column start -->' +
                '<input type="text" name="label['+ id +'][left]" class="form-control" id="left' + no + '">' +
                '</div><!-- Left Column ends --><!--' +
                '--><div class="col-md-2 zirius-row"><!-- Label Column start -->' +
                '<input type="text" maxlength="32" name="label['+ id +'][name]" class="form-control text-center" id="label' + no + '">' +
                '<a href="#" class="btn btn-danger btn-xs remove-txt">Remove</a>' +
                '</div><!-- Label Column ends -->' +
                '    ' +
                '</div>');
                more_textbox.hide();
                $(".zirius-form:last").after(more_textbox);
                more_textbox.fadeIn("slow");
                return false;
            });
//Remove
            $('.form-horizontal').on('click', '.remove-txt', function(){
                $(this).parent().parent().css( 'background-color', '#FF6C6C' );
                $(this).parent().parent().fadeOut("slow", function() {
                    $(this).parent().parent().css( 'background-color', '#FFFFFF' );
                    $(this).remove();
                    $('.label-numbers').each(function( index ){
                        $(this).text( index + 1 );
                    });
                });
                return false;
            });