Change Button Font Color on Hover With “Hover color” declared on each button tag not in CSS

Question

It\'s not a duplicate question - I don\'t want to simply change the font color in CSS.

My Issue:

I have products with colors. Blue, Red, Green, Yellow, Purple -

Answer 1

Consider CSS variables like this:

a.btn {
 padding:0 10px;
 color:#000;
 border:1px solid;
}
a.btn:hover {
  color:var(--h, yellow);
}

<a href="#" class="btn btn-inv btn-lg" style="--h: #4a62ab">BUY</a>
<a href="#" class="btn btn-inv btn-lg" style="--h: red">BUY</a>
<a href="#" class="btn btn-inv btn-lg" style="--h: green">BUY</a>
<a href="#" class="btn btn-inv btn-lg" style="--h: #4a00fb">BUY</a>
<a href="#" class="btn btn-inv btn-lg">BUY</a> <!-- this one will get the default color (yellow) -->