jQuery changing contents of table data based on table data's class

Question

I have the following table that is populated with data taken from a database at runtime:

                while($stmt -> fetch()){
                //While there is still data being fetched, make the table rows below
                    echo "<tr data-id='$matchid'><td>
<img class='delete_imgs' data-id='$matchid' src='Images/delete_icon.png'>
<img class='edit_imgs' data-id='$matchid'src='Images/edit_icon.png'></td>
                            <td id='hero_column$matchid'>$hero</td>
                            <td id='result_column$matchid'>$result</td>
                            <td id='gamemode_column$matchid'>$gamemode</td>
                            <td id='mmr_column$matchid'>$mmr</td>
                            <td id='confirm_button$matchid all_cons' style='display: none'><img src='Images/confirm.png'></td>
                            </tr>";         
                }

The important parts are the <td> lines. I wish to use jQuery to edit the contents of that cell. So for example, I have <td id='hero_column11>randomdata</td> (the 11 being its potential runtime value). How do I use jQuery to change the 'randomdata' into something else?

Answer 1

try this:

$(document).ready(function(){
    $(document).find('td[id^="hero_column"]').html('new value');
});

I have include it inside document.ready() but you can insert it when you click a button or soething else

Answer 2

Try with: $('#hero_column11').html('new data');

You can include this in a onclick event on a button or a link.