Elemento Clonado não executa ação javascript

[Diegus Miestro 21]

Olá Pessoas, estou clonando uma elemento dom com .clone do jquery, mas o elemento clonando não executa a ação de clonagem, somente o "original" o faz.

 

HTML

<div id="grupo-estudantes">
   <div class="row">
      <div class="col m6">
         <label>Nome do Estudante</label>
         <input id="id_estudante-nome" maxlength="64" name="estudante-nome" type="text" />
      </div>
      <div class="col m4">
         <label>Turma do Estudante</label>
      </div>
      <div class="col m2">
         <a id="clonar-estudante" class="btn-floating btn-large waves-effect waves-light green tooltipped" data-position="right" data-delay="50" data-tooltip="Adicionar Estudante">
            <i class="material-icons">group_add</i>
         </a>
      </div>
   </div>
</div>

Javascript

(function(){
        jQuery("#clonar-estudante").click(function(){
            jQuery("#grupo-estudantes .row:first-child").clone().find("input").val("").end().appendTo("#grupo-estudantes");
        });
 })(jQuery);

[William Bruno 1501]

Use event delegate, e não duplique IDs.

[Diegus Miestro 21]

Obrigado, deu certo.

 

Nem tinha notado que estava duplicando ID

 

EDIT:

EDIT 2: Deu uma mudada no código, não sei se alguém viu, mas vou registrar

 

Dei uma mexida e fiz um plugin simples:

 

O HTML seria algo do tipo:

div#grupo-responsaveis>div{elemento a ser duplicado}>div.clonar-btn>button.clonar-btn-add+button.clonar-btn-remove

        jQuery.fn.cloneDom = function(){
            var $group = this;
            var $cloneDom = $group.children();
            console.log($cloneDom);
            $group.delegate(".clonar-btn-add", "click", function(){
                $cloneDom.clone().find("input").val("").end().appendTo($group);
            });
            $group.delegate(".clonar-btn-remove", "click", function(){
                jQuery(this).parent().parent().remove();
                if($group.children().length <= 0)
                {
                    $cloneDom.clone().find("input").val("").end().appendTo($group);
                }
            });
        };
        jQuery("#grupo-responsaveis").cloneDom();