JSFiddle - React, Tailwind, and code Playground

by Senthilmurugan R

HTML

<span class="js-textEdit" data-text="Show less">Show more</span>

CSS

span {
    color: #18c;
    cursor: pointer;
}

span:hover {
    text-decoration: underline;
}

JavaScript

$('.js-textEdit').click(function() {
  var oldText = $(this).text();
  var newText = $(this).attr('data-text');
  //alert(newText)
  if ($(this).text(oldText)) {
    $(this).text(newText);
  } else {
    $(this).text(oldText);
  }
    
    $(this).attr('data-text',oldText);
});