Bom dia senhores, estou tendo um certo problema para remover apenas um dos elementos.
Tenho um textarea que adiciona parágrafos, o problema está sendo na hora de excluir, quero que o btn exclua apenas a div pai dele e não dos demais, como pode haver vários parágrafos eles são adicionados como class, e é aí que está o problema, quando clico no btn remover, ele excluir todos os elementos com a class. Estou usando $(this) e parent() mas como sou novo com jquery devo estar errando algo, por isso solicito a ajuda dos companheiros! Desde já agradeço! Abraço!
$("#addParagrafo").click(function () {
var conteudo = $('#adicionarConsideracoesGerais').val();
$("#consideracoesGeraisParagrafos").append("<div class='painel-paragrafo'><textarea class='form-control paragrafoConsideracoesGerais' disabled rows='4'>" + conteudo + "</textarea><br><button type='button' class='btn btn-xs btn-default pull-right btn-remover' title='Remover este parágrafo'><i class='fa fa-minus'>Remov</i></button><br><br></div>");
$('.painel-paragrafo').on('click', ".btn-remover", function () {
$(this).parent().parent().find('.painel-paragrafo').remove();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-12">
<div class="panel">
<div class="paragrafosConsideracoesGerais">
<ul id="consideracoesGeraisParagrafos">
</ul>
<textarea class="form-control" id="adicionarConsideracoesGerais"></textarea>
<div class="clearfix"></div><br>
<button class="btn btn-xs btn-default pull-right" type="button" title="Adicionar Parágrafo" id="addParagrafo"><i class="fa fa-plus">add</i></button>
</div>
</div>
</div>