title: Laravel: Jquery on click function issue
body: <p>I am trying to <code>alert</code> something but on click function is <code>running only once</code> on the first button. but I have <code>buttons on many rows</code>.</p>
  
  <p>I am fetching Data through Laravel from Database in a table. Only one button runs a function, then nothing happens with other buttons.</p>
  
  <p><strong>Jquery:</strong></p>
  
  <pre><code>jQuery(document).ready(function(e)  {
      $('#restore-data').on('click', function(e) {
      var val = $("#thisr").attr('value');
      alert(val);
  
      });
  });
  </code></pre>
  
  <p><strong>View:</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;table id="recover-table" class="table" &gt;
      &lt;thead&gt;
      &lt;tr class="bg-info"&gt;
          &lt;th&gt;Teacher Name&lt;/th&gt;
          &lt;th&gt;Date&lt;/th&gt;
          &lt;th&gt;Action&lt;/th&gt;
      &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
  
      @foreach($trashs as $trash)
  
      &lt;tr id="thisr" value="{{$trash-&gt;id}}"&gt;
      &lt;td class="text-nowrap "&gt;{{$trash-&gt;efirst}} {{$trash-&gt;esecond}}&lt;/td&gt;
  
      &lt;td class="text-nowrap "&gt;{{$trash-&gt;deleted_at}}&lt;/td&gt;
  
      &lt;td class="text-nowrap "&gt;&lt;button type="submit"  class="" name="id" 
      value="{{$trash-&gt;id}}" id="restore-data"&gt;Delete&lt;/button&gt;&lt;/td&gt;
  
      &lt;/tr&gt;
  
      @endforeach &lt;/tbody&gt;&lt;/table&gt;
  </code></pre>
  
  <p>Right now even alert is not working, but I want to achieve Refresh table after a record is deleted from Table.</p>
  
  <p><strong>Update:</strong> Now Alert is working fine, but when I delete a record by pressing a button, only one row is deleting. the function runs once.</p>
  
  <p><strong>Complete Js:</strong></p>
  
  <pre><code>jQuery(document).ready(function(e)  {
  
      $('#restore-data').on('click', function(e) {
  
      let teacher_id=$(this).attr('value');
      console.log('Restore button clicked!')
      e.preventDefault();
  
      $.ajax(
      {
        url: "/teachers/recover/" + $('#restore-data').attr("value"),
        type: 'GET', // Just delete Latter Capital Is Working Fine
        headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
        data: teacher_id,
  
       success: function (data) {
       console.log(data.msg);
       console.log(teacher_id);
  
       if(data.msg){
           $('#thisr').remove();
           $('#response').empty();
           $(".toast").toast('show');
           $('#response').append(data.msg);
        }
      },
      error: function (xhr) {
      console.log("Error Restoring Record");
      //console.log(xhr.responseText);
      },
     });
    });
  });
  </code></pre>