Underline <a> tag with React

Issue

I was Wondering how to give style to two tags in react without using the className(as not using className is the main challenge).

<a href="">Menu Here</a>
<a href="">Click Me </a>

So for the "curry dish," it should only underline when hovering.
And for the click me it should be underlined first and disappear while hovering on it.
I got both underlines removed using the code below. But still can’t figure out how to apply separate styling please help.

a: hover {
  text-decoration: underline;
}

Solution

**Tags in react without using the className:**

<span style={{color: "red",cursor: "pointer",
text-decoration: underline !important }}> 
<a href="">Menu Here</a>

</span>


   

Answered By – Thaiyalnayaki

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0