title: React - Add Active class to list item react-router
body: <p>Im learning now the <strong>ReactJS</strong> and I read a lot of topics about this article, but I can't find a right solution for my problem. </p>
  
  <p>I want to add a <code>active</code> class to <code>li</code> item not <code>a</code>, like</p>
  
  <pre><code>&lt;li class="active"&gt;&lt;a href=""&gt;Item&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>not</p>
  
  <pre><code>&lt;li&gt;&lt;a href="" class="active"&gt;Item&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p>This is my <code>reactJS</code> code</p>
  
  <pre><code>import React, { Component } from 'react';
  import { BrowserRouter as Router, Route, Link, Redirect, Switch } from "react-router-dom";
  
  const Content = () =&gt; (
    &lt;Router&gt;
      &lt;div className="content"&gt;
          &lt;div className="navigation"&gt;
              &lt;ul&gt;
                  &lt;li&gt;
                      &lt;Link to="/app"&gt;Wallets&lt;/Link&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;Link to="/backup"&gt;Backup&lt;/Link&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;Link to="/keys"&gt;Private keys&lt;/Link&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;Link to="/security"&gt;Security&lt;/Link&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                      &lt;a href="/" target="_blank"&gt;How it works&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
  
          &lt;div className="wrapper"&gt;
              &lt;Switch&gt;
                  &lt;Route path="/app" component={App} /&gt;
                  &lt;Route path="/backup" component={Backup} /&gt;
                  &lt;Route path="/keys" component={Keys} /&gt;
                  &lt;Route path="/security" component={Security} /&gt;
                  &lt;Redirect to="/app" /&gt;
              &lt;/Switch&gt;
          &lt;/div&gt;
      &lt;/div&gt;
    &lt;/Router&gt;
  );
  
  ...
  
  export default Content;
  </code></pre>