Using the following navigation I display an image gallery of products that start with the selected letter.

1. <ul class="pagination pagination-lg" id="letterNavMenu">
2.                 <li class="page-item active"><a class="page-link" onclick="">A</a></li>
3.                 <li class="page-item"><a class="page-link" onclick="reloadData('B')">B</a></li>
4.                 <li class="page-item"><a class="page-link" onclick="reloadData('C')">C</a></li>
5.                 <li class="page-item"><a class="page-link" onclick="reloadData('D')">D</a></li>
6.                 <li class="page-item"><a class="page-link" onclick="reloadData('E')">E</a></li>
7.                 <li class="page-item"><a class="page-link" onclick="reloadData('F')">F</a></li>
8.                 <li class="page-item"><a class="page-link" onclick="reloadData('G')">G</a></li>
9.                 <li class="page-item"><a class="page-link" onclick="reloadData('H')">H</a></li>
10.                 <li class="page-item"><a class="page-link" onclick="reloadData('I')">I</a></li>
11.                 <li class="page-item"><a class="page-link" onclick="reloadData('J')">J</a></li>
12.                 <li class="page-item"><a class="page-link" onclick="reloadData('K')">K</a></li>
13.                 <li class="page-item"><a class="page-link" onclick="reloadData('L')">L</a></li>
14.                 <li class="page-item"><a class="page-link" onclick="reloadData('M')">M</a></li>
15.                 <li class="page-item"><a class="page-link" onclick="reloadData('N')">N</a></li>
16.                 <li class="page-item"><a class="page-link" onclick="reloadData('O')">O</a></li>
17.                 <li class="page-item"><a class="page-link" onclick="reloadData('P')">P</a></li>
18.                 <li class="page-item"><a class="page-link" onclick="reloadData('Q')">Q</a></li>
19.                 <li class="page-item"><a class="page-link" onclick="reloadData('R')">R</a></li>
20.                 <li class="page-item"><a class="page-link" onclick="reloadData('S')">S</a></li>
21.                 <li class="page-item"><a class="page-link" onclick="reloadData('T')">T</a></li>
22.                 <li class="page-item"><a class="page-link" onclick="reloadData('U')">U</a></li>
23.                 <li class="page-item"><a class="page-link" onclick="reloadData('V')">V</a></li>
24.                 <li class="page-item"><a class="page-link" onclick="reloadData('W')">W</a></li>
25.                 <li class="page-item"><a class="page-link" onclick="reloadData('X')">X</a></li>
26.                 <li class="page-item"><a class="page-link" onclick="reloadData('Y')">Y</a></li>
27.                 <li class="page-item"><a class="page-link" onclick="reloadData('Z')">Z</a></li>
28. </ul>

The releoadData() removes the 'active' class from the <li> item and then makes an ajax call to get all the products that starts with that letter and displays thumbnails for each of them.

If the user had clicked on 'T' how do I use jquery to select the <li class="page-item"> element for T to run the function addClass('active') so T becomes highlighted?