Navlink how to change clicked link color?

Question

JavaScript

I want that when I click on a link, its color changes and stays the same. But after clicking on another one, it changed color, and the previous link again became the same.

jsx:

<nav className={classes.nav}>
            <div className={classes.item}>
                <NavLink to="/profile" activeClassName={classes.active}>Profile</NavLink>
            </div>
            <div className={classes.item}>
                <NavLink to="/dialogs"activeClassName={classes.active}>Messages</NavLink>
            </div>
</nav>

CSS:

.nav {
    grid-area: n;
    background-color: lightslategrey;
}

.item a {
    color: white;
    font-size: 25px;
}

Can you please tell me how to describe this in CSS?

Answer 1

visited is:a:visited {}

Answer 2

I understand that you have version 6 of the router. Now you need to do this

<NavLink
  to="/profile"
- activeClassName={classes.active}
+ className={({ isActive }) => (isActive ? classes.active : '')}
>
  Messages
</NavLink>