problem when adding row to table with javascript

I’m working on a Laravel project where I need to add a row to a table in when clicking on a button inside a popup modal. This is supposed to be a simple task, yet the problem is it won’t add a new row to the table.

This is my code:

create.blade.php

@section('content')
<div class="row mb-3">
    <label for="colFormLabel" class="col-sm-2 col-form-label">Data Barang</label>
    <div class="col-sm-10 d-flex align-items-center">
        <button type="button" class="btn btn-info btn-sm text-nowrap" id="btn-modal-cari-customer" data-bs-toggle="modal"
            data-bs-target="#modalCariBarang">
            Cari Barang
        </button>
        @include('barang.modal-cari-barang')
    </div>
</div>

<div class="row mb-3">
    <div class="table-responsive small table-content overflow-visible">
        <table class="table table-striped table-bordered table-sm table-hover">
            <thead>
                <tr>
                    <th scope="col" class="fit text-start px-2">#</th>
                    <th scope="col" class="px-2">Nama Barang</th>
                    <th scope="col" class="fit px-2">Qty</th>
                    <th scope="col" class="fit px-2">Harga Satuan</th>
                    <th scope="col" class="fit px-2">Subtotal</th>
                    <th scope="col" class="fit px-2">Profit</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="fit">1.</td>
                    <td>
                        <a href="#" data-bs-toggle="modal" data-bs-target="#modal-show-item-penawaran"
                            data-slug="lampu-led-12-watt">
                            Lampu LED 12 watt
                        </a>
                    </td>
                    <td class="text-center fit">15</td>
                    <td class="text-end fit">Rp 15.000</td>
                    <td class="text-end fit">Rp 20.000</td>
                    <td class="text-end fit">Rp 75.000</td>
                </tr>
                <tr>
                    <td class="fit">2.</td>
                    <td>
                        <a href="#" data-bs-toggle="modal" data-bs-target="#modal-show-item-penawaran"
                            data-slug="cctv-panasonic">
                            CCTV Panasonic
                        </a>
                    </td>
                    <td class="text-center fit">10</td>
                    <td class="text-end fit">Rp 200.000</td>
                    <td class="text-end fit">Rp 220.000</td>
                    <td class="text-end fit">Rp 200.000</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<script src="/assets/js/script.js"></script>
@endsection

modal-cari-barang.blade.php :

<!-- Modal -->
<div class="modal fade" id="modalCariBarang" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h1 class="modal-title fs-5" id="exampleModalLabel">Modal title</h1>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body">
          ...
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary" id="btn1">Save changes</button>
        </div>
      </div>
    </div>
  </div>

script.js

    const btn1 = document.querySelector('#btn1');
    btn1.addEventListener('click', function() {
        let table = document.querySelector('form table');
        let tblPenawaranItem = table.getElementsByTagName('tbody')[0];
    
        let newRow = tblPenawaranItem.insertRow(-1);
        let cell1 = newRow.insertCell(0);
        let cell2 = newRow.insertCell(1);
        let cell3 = newRow.insertCell(2);
        
        cell1.innerHTML = 'zxc';
        cell2.innerHTML = 'aaa';
        cell3.innerHTML = 'lorem';
        console.log('zzzzzzzzzz', newRow);
    });

when I try to log the newRow variable, this is what I get:

what am I doing wrong?? any help is appreciated..