Javascript 如何为表中的自定义选择执行事件侦听器？

我有一个表，它包含来自数据库的列，我在列上有自定义选择，还有按钮更新。现在我需要当我在自定义选择中单击按钮make event listener并获取用户选择的内容并使用JavaScript在控制台上打印选择的值时…我如何才能做到这一点请任何人帮助我

@foreach ($bookinghalls as $item)

    <tr>
        <td>{{$item->id}}</td>
    <td>{{$item->name}}</td>
   <td >{{$item->hall_name}}</td>
    <td>{{$item->from_date}}</td>
    <td>{{$item->to_date}}</td>
    <td>{{$item->type_booking}}</td>  
    <td  ><select class="custom-select mr-sm-2" name="intervel"   >
@if ($item->pay==0)
<option value="0" >Not paid</option>    
<option value="1" >paid </option>

@else ($item->pay==1)
<option value="1" >paid </option>
<option value="0" >Not paid</option>
@endif
</td>
     <td id="stauts">  <?php 
        if($item->stauts==0)
         print_r("available");
     elseif($item->stauts==1)
     print_r("it's Processing ");
     elseif($item->stauts==2)
     print_r("booking done");
       ?></td>
     <td><button type="submit"  class="btn btn-primary but_update"  name="imagaid"   >update</button>
     </td>

@foreach（$bookinghalls as$item）
{{$item->id}
{{$item->name}
{{$item->hall_name}
{{$item->from_date}
{{$item->to_date}
{{$item->type_booking}
@如果（$item->pay==0）
未付
支付
@其他（$item->pay==1）
支付
未付
@恩迪夫
要为
标记设置事件侦听器并获取
文本的值，请执行以下操作：

document.querySelector('.custom-select').addEventListener('change', function () {
    let selectedValue = this.value;
    console.log(selectedValue);
});