JSFiddle - React, Tailwind, and code Playground

HTML

<div class="someClass" data-spaces="1" data-section="welcome">Click me</div>

CSS

.someClass { padding: 20px; background-color: #f1f1f1; color: #000; width: 200px; margin: 0 auto; text-align: center; }

JavaScript

$(document).ready(function() {
    $('.someClass').click(function() {
        var spaces = $(this).data('spaces');
        var section = $(this).data('section');
        console.log('This number of spaces is: ' + spaces + ' and the section is: ' + section);
    });
    
    $('[data-section="welcome"]').click(function() {
                $(this).html('Clicked');
                $(this).attr('data-section','expertise')
                $(this).attr('data-spaces','2')
    });
    
    $('[data-section="expertise"]').click(function() {
                $(this).html('Click me');
                $(this).attr('data-section','welcome')
                $(this).attr('data-spaces','1')
    });
    
    
});