JSFiddle - React, Tailwind, and code Playground

by Fernando Leal

HTML

<p>Milho <input type="checkbox" class="check"> </p>
    <p>Sorgo <input type="checkbox" class="check"> </p>
    <p>Monenzina <input type="checkbox" class="check"> </p>
    <p>Calcário Calcítico <input type="checkbox" class="check"> </p>
    <p>Farelo de Soja <input type="checkbox" class="check"> </p>
    <p>Farelo de Algodão <input type="checkbox" class="check"> </p>
    <p>Aromatizante <input type="checkbox" class="check"> </p>
    <p>Farelo de Arroz <input type="checkbox" class="check"> </p>

    <button id="add-button" type="submit">Adicionar</button>

    <div id="receiver">
        <form id="form-receiver">
            <fieldset>

            </fieldset>
        </form>
    </div>

JavaScript

$(function(){
$('#add-button').click(function(){
        $('.check').each(function(){
            if($(this).is(':checked')){
                var sel = $('#form-receiver fieldset').has("input[name='" + $(this).parent().text().toLowerCase().trim() + "']");
                console.log(sel);
                if(sel.length == 0){
                    $('#form-receiver fieldset').append("<p>" +$(this).parent().text()+ "<input name='" + $(this).parent().text().toLowerCase().trim() + "'></p>")
                }
            }
        })
    });
});