JSFiddle - React, Tailwind, and code Playground
HTML
<div class="content">
<div id="email-container" class="email-container">
<input class="1" type="text" value="" placeholder="Email">
<input class="1" type="text" value="" placeholder="Email">
<input class="1" type="text" value="" placeholder="Email">
<span class="plus-button">+</span>
</div>
</div>
JavaScript
$(document).ready(function()
{
$('.plus-button').click(AddNewRow);
});
function AddNewRow(event)
{
var clone = $('.email-container').last().clone().appendTo('.content');
clone.children('.1').val(''); //delete all values of your clone
clone.children('.plus-button').bind('click', AddNewRow);
var btn = $(this).parent().find('.plus-button'); //The cloned button
btn.text('-');
btn.removeClass('plus-button');
btn.addClass('minus-button');
btn.unbind('click'); //unbind the "old" click event
btn.click(RemoveRow);
}
function RemoveRow(event)
{
$(this).parent().remove();
}