JSFiddle - React, Tailwind, and code Playground

HTML

<div class="navigation">
            <ul>
                <li><a href="#home-page" class="fa fa-home"><span>HOME</span></a></li>
                <li><a href="#about-page" class="fa fa-user"><span>ABOUT</span></a></li>
                <li><a href="#resume-page" class="fa fa-graduation-cap"><span>RESUME</span></a></li>
                <li><a href="#portf-page" class="fa fa-briefcase"><span>PORTFOLIO</span></a></li>
                <li><a href="#contact-page" class="fa fa-envelope"><span>CONTACT</span></a></li>
            </ul>
        </div>

JavaScript

$('.navigation ul li a').click(function(e) {
  
  e.preventDefault();

  var el = $(this).index()
  
  console.log(el)

})