JavaScriptで入力した年数分テーブル行が追加・計算結果が自動入力されるようにしたい

やりたいこと

入力欄に「金額」「年数」「利率」を入力してボタンを押すと、計算結果がテーブルに表示されるようなアプリがあります。
入力した年数分、テーブルに行と結果が自動で追加されるようにするにはどうすればよいでしょうか。

イメージ

イメージとしては下記のサイトのように、年数分のテーブル行が自動生成され、計算結果がテーブルに表示されるのが理想です。
https://keisan.casio.jp/exec/system/1428900897

コード

html
  <div class="input">
    <label class="form-label">金額</label>
    <input id = "asset-retirement-cost" type="cost" class="form-control" placeholder="JPY'000">
    <label class="form-label">年数</label>
    <input id = "year-of-use" type="cost" class="form-control" placeholder="例）5"> 
    <label class="form-label">利率（％）</label>
    <input id = "interest" type="cost" class="form-control" placeholder="例）1"> 
    <button type="button" id="button">計算</button>
    <label class="form-label">結果</label>
    <h3><u class="present-value" id="present-value"></u></h3> 
  </div>

<!-- 年間推移 -->
  <div class="table" id="table">
    <table id="table-style">
          <th>年</th>
          <th>資産</th>
          <th>負債</th>
        <tr> 
          <td>1年</td>
          <td class="assets"></td>
          <td class="debit"></td>
        </tr>
        <tr> 
          <td>2年</td>
          <td class="assets"></td>
          <td class="debit"></td>
        </tr>
        <tr> 
          <td>3年</td>
          <td class="assets"></td>
          <td class="debit"></td>
        </tr>
        <tr> 
          <td>4年</td>
          <td class="assets"></td>
          <td class="debit"></td>
        </tr>
        <tr> 
          <td>5年</td>
          <td class="assets"></td>
          <td class="debit"></td>
        </tr>
    </table>
  </div>

javascript
window.addEventListener('load', function(){
  const cost = document.getElementById("asset-retirement-cost");
  const year = document.getElementById("year-of-use");
  const interest = document.getElementById("interest");
  const button = document.getElementById("button");
  const presentValue = document.getElementById("present-value");
  const assets = document.getElementsByClassName("assets");
  const debit = document.getElementsByClassName("debit");

  button.addEventListener('click', function() {
    const inputCost = cost.value; 
    const inputYear = year.value;
    const inputInterest = parseFloat(interest.value);
    const num = parseFloat(1);
    const year1 =  parseFloat(0.2);

    const result = Math.floor(inputCost/((inputInterest + num)**inputYear));
    presentValue.innerHTML = result.toLocaleString();
    const assetsLength = assets.length;
    let assetsIndex = 0;
    while (assetsIndex < assetsLength) {
      assets[assetsIndex].innerHTML =  Math.floor(result * year1).toLocaleString();
      assetsIndex++;
    }

    const debitLength = debit.length;
    let debitIndex = 0;
    let resultDebit = Math.ceil(result + parseFloat(result)*0.01);
    while (debitIndex < debitLength) {
      debit[debitIndex].innerHTML = resultDebit.toLocaleString(); 
      debitIndex++;
      resultDebit += Math.ceil(parseFloat(resultDebit)*0.01);
    };
  })
});

調べたこと・試したこと

javascript
    var table = document.getElementById("table");
    //列を作成
    td = new Array(3);
    for(var i = 0; i < assetsLength; i++){
    td[i] = document.createElement("td");
    }
    //行を作成
    tr = new Array(year);
    for(var j = 0; j < year; j++){
    tr[j] = document.createElement("tr");
    }
    for(j = 0; j < year; j++){
    for(i = 0; i < 3; i++){
      //列を追加
      tr[j].appendChild(td[i]);
    }
    //行を追加
      table.appendChild(tr[j]);
    }