JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="provider-list">
    <li name="category1">
        <a href="#">Category Header 1</a>
        <ul id="category1">
            <li>
                <img src="">
                <a href="#">Item 1</a>
            </li>
            <li>
                <img src="">
                <a href="#">Item 2</a>
            </li>
        </ul>
    </li>
    <li name="category2">
        <a href="#">Category Header 2</a>
        <ul id="category2">
            <li>
                <img src="">
                <a href="#">Item 1</a>
            </li>
        </ul>
    </li>
</ul>

JavaScript

$("#provider-list").on("click", "li", function() {
    var projIndex = $(this).index();
    console.log(projIndex)
    //OpenProject()
});