JSFiddle - React, Tailwind, and code Playground

HTML

<div id="root">
<input id="addForm" type="button" value="añadir formulario" class="activo"/>
</div>
<!--
LECTURA:
http://docs.jquery.com/DOM/Traversing
http://api.jquery.com/category/manipulation/
-->

CSS

form, input[type="button"]{
padding:1em;
}
form{
background: whitesmoke;
margin:1em 0;
}
fieldset{
    border: 1px dotted gray;
    padding:1em;
    margin: 1em 0 0 0;
}

JavaScript

$(function(){
    $("#addForm").click(function(){
        if($(this).hasClass('activo')){
            $(this).attr("class", "inactivo");  
            $(this).val("quitar formulario");   
            $("#root").append("<form id='form'><input id='addBlock' type='button' value='añadir bloque' class='activo'/></form>");
            $("#addBlock").click(function(){
                if($(this).hasClass('activo')){
                     $("#form").append("<fieldset id='block'><legend>bloque</legend><span>... elementos de formulario ...</span></fieldset>");
                    $(this).attr("class", "inactivo");  
                    $(this).val("quitar bloque");   
                }
                else
                {      
                    $("#block").remove();
                    $(this).attr("class", "activo");
                    $(this).val("añadir bloque");   
                }                    
            });  
        }
        else
        {
            $("#form").remove();
            $(this).attr("class", "activo");
            $(this).val("añadir formulario");   
        }                    
    });
});