How To Show First Two Rows Of A Hidden Table In Another Table

I have a table in a hidden modal that populates dynamically anywhere from 0 to 10 rows. I need to get the data from the first two rows of this table to show in another table on my

Solution 1:

Consider this school case = we access the elements of an html table by their reference in rows / cells:
(it is also better to use textContent to read their content, if it is only textual)

if you want a identical copy of rows, it should be better to use cloneNode method => https://developer.mozilla.org/en-US/docs/Web/API/Node/cloneNode

const myTab = document.querySelector('#my-table tbody')

console.log( 'lines .....= ', myTab.rows.length )
console.log( 'columns ...= ', myTab.rows[0].cells.length )
console.log( 'table[1,3] = ', myTab.rows[1].cells[3].textContent, '(value)')

table { border-collapse: collapse; margin: 1em }
td { border: 1px solid grey; width: 2em; height: 1em; }

<table id="my-table">
  <tbody>
    <tr><td>0.0</td><td>0.1</td><td>0.2</td><td>0.3</td><td>0.4</td></tr>
    <tr><td>1.0</td><td>1.1</td><td>1.2</td><td>1.3</td><td>1.4</td></tr>
    <tr><td>2.0</td><td>2.1</td><td>2.2</td><td>2.3</td><td>2.4</td></tr>
    <tr><td>3.0</td><td>3.1</td><td>3.2</td><td>3.3</td><td>3.4</td></tr>
  </tbody>
</table>