Получить класс внутри класса с щелчком в Javascript-Jquery [duplicate]

Используя React Router v4, я получил его только для работы, включив теги <li> в компонент NavLink. Решения, которые имеют теги <li>, обертывающие ссылки, привели к тому, что тег HOME <li> всегда имел класс active.

import React from 'react'
import { NavLink } from 'react-router-dom';

class Header extends React.Component {

  render() {
    return (
      <div>
        <header>

          <nav>
            <ul>
              <NavLink activeClassName={"active"} exact={true} to="/"><li>Home</li></NavLink>
              <NavLink activeClassName={"active"} to="/about"><li>About</li></NavLink>
              <NavLink activeClassName={"active"} to="/courses"><li>Courses</li></NavLink>
            </ul>
          </nav>

        </header>
      </div>
    )
  }
}

export default Header

Я скорректировал селектора CSS li и a соответственно.