Using set item and get item in for loop to get results in html table (JS)

Question

I want to use set item and get item in for loop to get 6 results for 6 different rows in a html table. Eg: Year = 1, month = 1, repayment =$2,000 etc. I got the same amount for all my table data.

My Html code:

   <div id="yr" class="year"></div>

My Js code:

   $(document).ready(function () {
        $("#btnrepayment").bind("click", function () {
            repayment();
        });
    });

     function repayment() {
        var x = document.getElementById("yr");
        if (x.style.display === "none") {
            x.style.display = "block";
        } else {
            x.style.display = "none";
        }

        var test, tr, iinterest;

        test =
            `<table border="1px">
     <thead>
      <tr>
        <th>Year</th>
        <th>Month</th>
        <th>Repayment</th>
        <th>Interest</th>
        <th> Loan Paid </th>
        <th> Loan Balance </th>
        </tr>
      </thead>
      <tbody>${createRows()}</tbody>
</table>`;
        document.getElementById("yr").innerHTML = test;
    }
    repayment();

    function createRows() {
        let tr = '';
        let iinterest = localStorage.getItem("Anually");
        $("#repayment").html("$" + iinterest);

        for (var i = 0; i < 4; i++) {
            tr += '<tr>' + '<tr>';
            for (var j = 0; j < 6; j++) {
                tr += '<td>' + iinterest;
            }
        }
        return tr;

    }

My wrong diagram

Answer 1

Because iinterest still has the same value

let iinterest = localStorage.getItem("Anually");

You have to create other variables for the other values. Alternatively, you could put them in an array to browse this array in the for loop.

    let iinterest = localStorage.getItem("Anually");
    let dontknow = localStorage.getItem("Monthly");
    let myArray = [iinterest, dontknow]; //etc
    $("#repayment").html("$" + iinterest);

    for (var i = 0; i < 4; i++) {
        tr += '<tr>' + '<tr>';
        for (var j = 0; j < 6; j++) {
            tr += '<td>' + myArray[j];
        }
    }