After successfully storing data from an HTML table on page 1 in an array object (arrData) and saving it to session storage, the next challenge is how to display this data on a new HTML table on page 2. I am new to JavaScript, so any help would be appreciated. Thanks in advance!
https://i.sstatic.net/MIWkf.png
JAVASCRIPT CODE ON PAGE 1
var arrData = [];
$("#checkout").on('click',function(){
$("#table tr").each(function(){
var currentRow = $(this);
var col1_value = currentRow.find("td:eq(0)").text();
var col2_value = currentRow.find("td:eq(1)").text();
var obj = {};
obj.col1 = col1_value;
obj.col2 = col2_value;
arrData.push(obj);
sessionStorage.myArrData = JSON.stringify(arrData);
});
console.log(arrData);
});
HTML TABLE TEMPLATE ON PAGE 2
<table class="table table-checkout" id="table">
<thead>
<tr>
<th>Item</th>
<th>Quantity</th>
</tr>
</thead>
<tbody>
</tbody>
JAVASCRIPT CODE ON PAGE 2
var arrData = JSON.parse(sessionStorage.myArrData);