JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="lista-paragrafos"></ul>
<div class="panel-body">
    <textarea rows="3" id="paragrafo" name="checklist" class="form-control "></textarea>
    <br />
    <button type="button" class="btn-xs btn btn-default pull-right" title="Adicionar este parágrafo" onclick="addParagrafo()"><i class="fa fa-plus">Adcionar</i>

    </button> <span class="help-block">Digite ou altere o objeto referente aos documentos da sua inspeção.</span>

</div>

JavaScript

function addParagrafo() {
    var ul = document.getElementById("lista-paragrafos");
    var conteudo = document.getElementById("paragrafo").value;
    ul.innerHTML += "<div class='panel-body'><li>" + conteudo + "<br><br> <div class ='col-xs-12'><button type='button' class='btn-remover btn-default'><i class='fa fa-minus'></i> Remover</button><button type='button' class='btn-tabelas btn-primary' ><i class='fa fa-plus'></i> Tabelas</button><button type='button' class='btn-imagens btn-primary'><i class='fa fa-plus'></i> Imagens</button></div></li></div>";

    var lis = document.getElementById("lista-paragrafos").getElementsByTagName('li');
    for (var i = 0; i < lis.length; i++) {
        var list = lis[i].className = 'itens-checklist:' + i;
    }
    var btn = ul.getElementsByTagName('button');
    for (var i = 0; i < btn.length; i++) {
        btn[i].className += ' pull-right btn btn-xs btn-checklist: ' + list;
    }
}




window.onload = function () {
    function closest(el, cssClass) {
        while (el = el.parentNode){
            if (el.classList.contains(cssClass)) return el;
        }
        return false;
    }
    document.getElementById('lista-paragrafos').addEventListener('click', function (e) {
        if (e.target.classList.contains('btn-remover')){
            var panelBody = closest(e.target, 'panel-body');
            panelBody.parentNode.removeChild(panelBody);
        }
    });
}