Css Hover <a> inside <td>

Question

I had a table, inside the tr there are td which there is a link. well, i want to make a class that can change the color the link inside the td. here is my code:

<style>
    .dihover{transition: .5s;}
    .dihover:hover{background-color:#B7192A; color: white; cursor: pointer;}
    a.setan{color:#7E7E7E;}
    .setan:hover{color:white;}
    tr.dihover a:hover{color:white;}
</style>  

<table>
    <tr class="dihover">
        <td><a class="setan">this supposed to change colors</a></td>
        <td><a class="setan">this supposed to change colors</a></td>
    </tr>
</table>

what did i do wrong? Thank you in advance!

Answer 1

I try to modify your code..check if it is what you require.
HTML

<table>
<tr class= setan>
    <td><a>this supposed to change colors</a></td>
    <td><a>this supposed to change colors</a></td>
</tr>

CSS

<style>
    .dihover{transition: .5s;}
    .dihover:hover{background-color:#B7192A; color: white; cursor: pointer;}
    a.setan{color:#7E7E7E;}
    .setan:hover{color:white;}
    tr.dihover a:hover{color:white;}
</style>