JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="tabs">

                                    <li><a href="#tab1" class="tab" id="tab1" onclick="return ValidateFileUpload('img1')">Left</a></li>
                                    <li><a href="#tab2" class="tab" id="tab2" onclick="return ValidateFileUpload('img2')">Right</a></li>
                                    <li><a href="#tab3" class="tab" id="tab3" onclick="return ValidateFileUpload('img3')">Top</a></li>
                                    <li><a href="#tab4" class="tab" id="tab4" onclick="return ValidateFileUpload('img4')">Bottom</a></li>
                                    <li><a href="#tab5" class="tab" id="tab5" onclick="return ValidateFileUpload('img5')">Front</a></li>
                                    <li><a href="#tab6" class="tab" id="tab6" onclick="return ValidateFileUpload('img6')">Rear</a></li>

                                </ul>
<div id="sample"></div>

JavaScript

$('.tab').click(function(){
    var a=$(this).attr('id');
    $('#sample').html('Active Tab is'+a);
});