AfterInsertRow, setCell. programmatically change the content of the cell

Question

I am new to JqGrid, so please bear with me. I am having some problems with styling the cells when I use a showlink formatter. In my configuration I set up the AfterInsertRow and it works fine if I just display simple text:

 afterInsertRow: function(rowid, aData) {
   if (aData.Security == `C`) {
     jQuery('#list').setCell(rowid, 'Doc_Number', '', { color: `red` });
 } else
 {
   jQuery('#list').setCell(rowid, 'Doc_Number', '', { color: `green` });
 }
}, ...

This code works just fine, but as soon as I add a formatter

{'Doc_Number, ..., 'formatter: ’showlink’, formatoptions: {baseLinkUrl: ’url.aspx’}

the above code doesn't work because a new element is added to the cell

<a href='url.aspx'>cellValue</a>

Is it possible to access programmatically the new child element using something like the code above and change the style?

`<a href='url.aspx' style='color: red;'>cellValue</a>` etc.

UPDATE: In order to work you have to do as follow:

jQuery('#list').setCell(rowid, 'Doc_Number', '', 'redLink');

CSS Class

.redLink a {
    color: red;
}

Answer 1

You could add a class to the cell:

jQuery('#list').setCell(rowid, 'Doc_Number', '', 'redLink');

Then define a CSS class along these lines:

.redLink a {
    color: red;
}