Data Preloaded with JQUERY in A MODAL

Question

I have a Dynamic table, I use TWIG to fill the data automatically, in this table I have in each Row 2 buttons, one of Edit, and the Delete Other, when I click the Edit Open button A modal, i would like to know how I do so that the data of that specific line that was clicked on the edit button is pre loaded in modal inputs, I can fill the data using Jquery, but the problem is that it only works for First Line.

 <!-- MODAL EDIT UNIDADE -->
<div class="modal fade" tabindex="-1" role="dialog" id="edita_unidade">
<div class="modal-dialog" role="document">
  <div class="modal-content">
    <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal" aria-label="Close">
    <span aria-hidden="true">&times;</span>
       </button>
      <h5 class="modal-title">Editar Unidade</h5>
    </div>
    <div class="modal-body">
      <form>
         <div class="row">
          <div class="col-lg-12">
        <div class="form-group">
              <label>CNPJ:</label>
               <input class="form-control" type="text" name="cnpj_" id="cnpj_">
            </div>
          </div>
        </div>
    <div class="row">
      <div class="col-lg-12">
        <div class="form-group">
              <label>Nome Unidade:</label>
              <input class="form-control" type="text" name="unidade_" id="unidade_">
            </div>
          </div>
        </div>
      </form>
    </div>
    <div class="modal-footer">
      <button id="left_modal" type="button" class="btn btn-info pull-left" data-dismiss="modal"><i class="fa fa-close"></i> Fechar</button>
       <button id="edit_unidade_modal" type="button" class="btn btn-success pull-right"><i class="fa fa-edit"></i> Atualizar</button>
    </div>
  </div>
</div>
</div>

 <table width="100%" class="table table-hover" id="unidades-grupo" referral="0" style="border-top: 0;">
                    <thead>

                        <tr>
                            <th>ID Unidade</th>
                            <th>Nome</th>
                            <th>CPF/CNPJ</th>
                            <th>Data Cadastro</th>
                            <th>ID Grupo</th>
                            <th></th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>

                        <input type="hidden" id="id_unidade_dell" value="9">
                            <tr>
                                <td onclick="redirectUnidade('9')">9</td>
                                <td onclick="redirectUnidade('9')">Filial Redenção - 002</td>
                                <td onclick="redirectUnidade('9')">102938475657482</td>
                                <td onclick="redirectUnidade('9')">2019-01-17T19:03:11.000Z</td>
                                <td onclick="redirectUnidade('9')">1</td>
                                 <td style="text-align: center;"><i data-toggle="modal" data-target="#edita_unidade" cnpjUnidade="102938475657482"  nomeUnidade="Filial Redenção - 002" id="icon_edit_uni"  onclick="edit_unidade(9)" idUnidade='9' class="fa fa-edit editaGrupo"title="Editar Unidades"></i></td>
                                        <td style="text-align: center;"><i id="delete_uni" onclick="del_unidade(9)" class="fa fa-trash grupo-del"  title="Deletar Unidade"></i></td>
                            </tr>


                        <input type="hidden" id="id_unidade_dell" value="11">
                            <tr>
                                <td onclick="redirectUnidade('11')">11</td>
                                <td onclick="redirectUnidade('11')">Filial New York</td>
                                <td onclick="redirectUnidade('11')">66449484756</td>
                                <td onclick="redirectUnidade('11')">2019-01-19T22:12:20.000Z</td>
                                <td onclick="redirectUnidade('11')">1</td>
                                 <td style="text-align: center;"><i data-toggle="modal" data-target="#edita_unidade" cnpjUnidade="66449484756"  nomeUnidade="Filial New York" id="icon_edit_uni"  onclick="edit_unidade(11)" idUnidade='11' class="fa fa-edit editaGrupo"title="Editar Unidades"></i></td>
                                        <td style="text-align: center;"><i id="delete_uni" onclick="del_unidade(11)" class="fa fa-trash grupo-del"  title="Deletar Unidade"></i></td>
                            </tr>

                                                                          </tbody>
                </table>

<script>
function edit_unidade(id){
  $('#icon_edit_uni').on('click', function(){
    var nome = $(this).attr('nomeUnidade');
    // alert(nome);
    var cnpj = $(this).attr('cnpjUnidade');
    // alert(cnpj);
    $('#cnpj_').attr('value', cnpj);
    $('#unidade_').attr('value', nome);
    $('#edit_unidade_modal').attr('value', id);
  });
}
</script>

Answer 1

 $(document).on('click', '#icon_edit_uni', function(){
    var id = $(this).attr('idUnidade');
    var nome = $(this).attr('nomeUnidade');
    var cnpj = $(this).attr('cnpjUnidade');  
    $('#cnpj_').attr('value', cnpj); 
    $('#unidade_').attr('value', nome); 
    $('#edit_unidade_modal').attr('value', id);
  });

RESOLVED