How to make ajax click on a random number of links on the page?

Question

AJAX

Links on the page are displayed in my php code like this

<?php foreach ($ids as $itemIds): ?>

<a id="url-1" href="/myscript.php?id=<?php echo $itemIds ?> ?>">Клик по ссылке 1</a>
<div id="info-1"></div>
<br>
<a id="url-2" href="/myscript.php?id=<?php echo $itemIds ?> ?>">Клик по ссылке 2</a>
<div id="info-2"></div>
<br>
<a id="url-3" href="/myscript.php?id=<?php echo $itemIds ?> ?>">Клик по ссылке 3</a>
<div id="info-3"></div>

<?php endforeach; ?>

The $ids array contains identifiers that were previously taken from the database. There may be a different number of such identifiers in different periods of time.
These identifiers form the parameters for each link. All of it works well. But you need to translate this whole thing into ajax.
So that if, for example, I clicked on the link id="url-1", the response from the server would be displayed inside the tag And so on for each link on the page. ================================================= ============================== Now let's move on to ajax. I have this ajax code based on jquery.<div id="info-1"></div>

<script>
  function funcBefore(){
    $("#info-1").text("Ожидание данных");
  }
  function funcSuccess(data){
    $("#info-1").text(data);
  }
  
  
    $(document).ready(function(){
      $("#url-1").on("click", function(){
        $.ajax({
          url: "myscript.php",
          type: "GET",
          dataType: "html",
          beforeSend: funcBefore,
          success: funcSuccess
          
        });
      });
    });
    
</script>

With it, I can process the elements I need on the page. But the problem is how do I handle dynamic links on the page, which can be a different number? And which have different parameters for the GET request. That is, as I indicated in the example above.
I will be very grateful to everyone for your help!

Answer 1

Add some class to all links that should be processed, and instead of the id selector, use the class selector in jq. Get the parameters for the get request from the link itself using the same jQuery, create the query string dynamically after the click.

Answer 2

things can be simpler:

$('[data-toggle="myloader"]').on('click',function(e){
    e.preventDefault(); //отменили get
    var url = $(this).attr('href'), // взяли ссылку
          container_selector = $(this).attr('data-container'); // взяли селектор
    $(container_selector).load(url); //отправили ajax, получили html вставили в контейнер
});

That's all. The main thing for links should be data-toggle="myloader" and each has its own href and its own data-container, for example:

<a href="/some/url/to/?hrenEgoZnaet=kuda" data-container="#some_id" data-toggle="myloader">жмакай нежно</a>