JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="tabs currenttab-info"> 
        <li id="tab-info" class="info"><strong><a href="#">Information</a></strong></li> 
        <li id="tab-write" class="write"><strong><a href="#">Write Feedback</a></strong></li> 
        <li id="tab-read" class="read"><strong><a href="#">Read Feedback</a></strong></li> 
      </ul>

JavaScript

$( '#tab-info' ).click(function() { 
    $('.tabs').removeClass("currenttab-read"); 
    $('.tabs').removeClass("currenttab-write"); 
    $('.tabs').addClass("currenttab-info");   
}); 
 
$( '#tab-write' ).click(function() { 
    $('.tabs').removeClass("currenttab-info"); 
    $('.tabs').removeClass("currenttab-read"); 
    $('.tabs').addClass("currenttab-write");   
}); 
 
$( '#tab-read' ).click(function() { 
    $('.tabs').removeClass("currenttab-info"); 
    $('.tabs').removeClass("currenttab-write"); 
    $('.tabs').addClass("currenttab-read");   
});