JSFiddle - React, Tailwind, and code Playground

HTML

<body>
 	<div id='1' class='tab_content'>not</div>
 	<div id='2' class='tab_content active'>am active</div>
 	<div id='3' class='tab_content'>not</div>
 	<div id='4' class='tab_content'>not</div>

 	<button id='button' style='width:50px; height:50px;'>Click</button>
    </body>

CSS

.tab_content {
		height:100px;
		width:100px;
		border:1px solid black;
	}

JavaScript

$(function () {
    $('.tab_content').click(function () {
      $('.tab_content').removeClass('active').text('');
      $(this).addClass('active');
      $(this).text('am active');
    })
    
        $('#button').click(function () {
            $('.tab_content').each(function (i) {
                if ($(this).hasClass('active')) {
                    alert($(this).attr('id')+" is the active tab");
                    alert($(this).text()+" is the text");
                }
            });
         });
    });