JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://github.com/Nijikokun/Estro/raw/master/estro.min.js"></script>
<div id="test">Hello</div>
<br />
<div id="template">Hello %{name}!</div>
<div id="name">Estro</div>

CSS

#name { display: none; }

JavaScript

//  ______              
// (  /        _/_   0.1   
//   /--   (   /  _   __
// (/____//_)_(__/ (_(_)
// @author: Nijikokun <nijikokun@gmail.com>
// 
// This is a demo for Estro functionality / usage.
// You can get Estro @ <https://github.com/Nijikokun/Estro>

// jQuery used only to grab html element data easily.
var test = $('#test'), html = test.html(), template = $("#template"), name = $("#name").html();

// Template tests
if (template.html().contains('%')) template.html(template.html().bind({'name': name}));

// Tests
if (html.isEmpty()) test.html('Hello');
if (html.contains('e')) alert('contains an e');
if (html.startsWith('H')) alert('starts with H');
if (html.endsWith('ello')) alert('ends with ello');
if (html.equals('Hello')) alert('string matches Hello using equal()');
if (html.equalsIgnoreCase('HeLlO')) alert('string matches HeLlO using equalIgnoreCase()');
if (test.html('   Hello    ')) alert("+" + test.html() + "+"); alert("Trimmed: +" + test.html().trim() + "+");
if (test.html('Hello')) alert((html + " ").repeat(5));
alert(html.reverse());
alert(html.capitalize());
alert(template.html().replace(' ', '-').camelize()); // This format only: hello-there -> helloThere
alert(html.extract(/e/i, 0));