JSFiddle - React, Tailwind, and code Playground

HTML

<input onclick="copycat()" id="button" value="+" type="button">
<div id="AfficherBudget">
  <div class="copycat">
    <table id="TableauBudget">
      <tr>
        <td colspan="2">Total des charges </td>
        <td colspan="2">Total des produits</td>
        <td colspan="2" rowspan="2">Solde</td>
      </tr>
      <tr>
        <td>Type</td>
        <td>Montant</td>
        <td>Type</td>
        <td>Montant</td>
      </tr>
    </table>
    <input id="ChampsBudget" type="text"><br/>
    <input id="ChampsBudget1" type="text"> <br>
    <input id="ChampsBudget2" type="text"><br/>
    <input id="ChampsBudget3" type="text"><br>
    <input id="ChampsBudget4" type="text"><br><br>
  </div>
</div>
<script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="fichierExterne.js"></script><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

JavaScript

// fichier externe

$(document).ready(function(){
   $('#button').on('click', function(){
   	    $('.copycat:first').clone().appendTo($('#AfficherBudget'));
   })
  });