Get dynamically id in jQuery

Question

The objective is to dynamically retrieve the ids in the jquery code in order to click on the href to color the items in the table which have the same value the code below is done just with a single id. links are dynamically generated with a foreach loop in smarty. how to change the Js code to dynamically retrieve my ids and at the end when you click on the links it colors everything in the lou line is the searched word. Smarty HtML code:

    {foreach from=$translateArray key=key item=value}
     {if $key == $k}
         <a href="#" classe="inactiveLink" id="id_{$k}" style="color:#000080";>{$value}</a> 
         ({$val}) |
     {/if}
    {/foreach}

Jquery(dataTable) with id="id_single"

$(document).ready(function () {
var table = $("#my_table").DataTable({
    "rowCallback": function (row, data) {

        $('#id_single').on('click', function () {
            var value = $("#id_single").text();// How to get id dynamically here
            console.log(value);
            highLight(value, row);
        });

        function highLight(value, row) {
            $(row).css('color', 'unset');
            $(row).css('font-weight', 'unset');

            if (data[2] === value) {
                $(row).css('background-color', 'lightblue');
                $(row).css('font-weight', 'bold');
            }
        }

    }
});
});
 

Answer 1

you can use class for this like

{foreach from=$translateArray key=key item=value}
 {if $key == $k}
     <a href="#" classe="inactiveLink id_single"  style="color:#000080";>{$value}</a> 
     ({$val}) |
 {/if}
{/foreach}
$(document).ready(function () {

var table = $("#my_table").DataTable({ "rowCallback": function (row, data) {

    $('.id_single').on('click', function () { // first change
        var value = $(this).text();// second change
        console.log(value);
        highLight(value, row);
    });

    function highLight(value, row) {
        $(row).css('color', 'unset');
        $(row).css('font-weight', 'unset');

        if (data[2] === value) {
            $(row).css('background-color', 'lightblue');
            $(row).css('font-weight', 'bold');
        }
    }

}

}); });