My goal is to insert data into an html table list according to the number of events on the button, so far so good. The problem is when the event happens for the second time and too many times it duplicates the row getting a total of 3 in the table and if the event happens a third time it prints 3 more times totaling 6?

Click to view interaction...

1. $(document).ready(function() {
     //
     var $ws_row_zero = 0;
     // atribui array vazia a uma variavel :
     $ws_array_row = [];
     //
     $(".btn_row_add").click(function() {
       // operator ++incremento do tipo prefixo ( action : )...
       $ws_row_in       = ++$ws_row_zero;
       $ws_ite_in       = $(this).attr("ws_data_ite");
       $ws_pec_in       = $(this).attr("ws_data_pec");
       $ws_btn_in       = '<a class="waves-effect waves-red btn-flat btn_row_del"><i class="material-icons">delete_outline</i></a>';
   
       // estrutura colunas da linha de uma tabela html atribuindo em variaveis :
       $ws_rwo_ou       = '<tr id="' + $ws_row_in +'"' + 'class="thead ws_row_out">';
       $ws_ite_ou       =   '<td class="fontype-2 ws_item_out">'  + $ws_ite_in + '</td>';
       $ws_pec_ou       =   '<td class="fontype-2 ws_price_out">' + $ws_pec_in + '</td>';
       $ws_btn_ou       =   '<td class="fontype-2 ws_trash_out">' + $ws_btn_in + '</td>';
       $ws_rwc_ou       = '</tr>';
   
       // concatena as strings atribuindo em uma var :
       $ws_value_row = $ws_rwo_ou + $ws_ite_ou + $ws_pec_ou + $ws_btn_ou + $ws_rwc_ou;
   
       // method .push( action : adiciona um ou mais elementos ao final de uma array e retorna um novo cumprimento do mesmo )
       $ws_array_row.push($ws_value_row);
   
       console.log($ws_array_row);
   
   
       // method .append(action: inserir conteúdo, especificado) :
       $('.ws_print_row').append($ws_array_row);
   
       // method .show(action: amostra element).
       $(".fixed-action-btn").show(300);
   
     });
   });