JSFiddle - React, Tailwind, and code Playground

by dshilkret

HTML

<!doctype html>
<title>val demo</title>
<p Name='p1'></p>
<p Name='p2'></p>
<p Name='p3'></p>
<p Name='p4'></p>
<p Name='p5'></p>


Selector 1: <input Name="t1" type="text" value=""> <br>
Method 2: <input Name="t2" type="text" value=""><br>
Attribute 1: <input Name="t3" type="text" value=''
<br><br>
Attribute 2: <input Name="t4" type="text" value=''<br><br><br>
<input Name="t5" id="t5" type="hidden" value=""><br><br>

<h1>Heading 1</h1>
<h2>Heading 2</h2>

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>



<button id="btn1">Animate height</button>
<button id="btn2">Reset height</button>
<button id="btn3">Fade Out</button><button id="btn2">Reset height</button>
<button id="btn4">Fade In</button>
<button id="btn5">Toggle class</button>



<div id="box1" name="box1" style="background:#98bf21;height:100px;width:100px;margin:6px;"></div>
<div id="box2"  name="box2" style="background:yellow;height:100px;width:100px;margin:6px;"></div>
<div id="box3"  name="box3" style="background:red;height:100px;width:100px;margin:6px;"></div>
   <script>
      
   $(document).ready(function(){
     
       $("#t5").keyup(function() {
    var value = this.value;
    var trimmed = $.trim(value);
    var subString = trimmed.substr(0, 10);
    $('#t_A').val(subString)
});
         $("input")
        .blur(function() {
       
         var value1 = $("[Name='t1']").val();
       var value2 = $("[Name='t2']").val();
        var value3 = $("[Name='t3']").val();
        var value4 = $("[Name='t4']").val();
        var value5 = $("[Name='t1']").val();
        var val6 = $("[Name='t5']").val('$("#box' + value2 + '").animate({height: "300px"});');
        $("[Name='p1']").text(value1);
        $("[Name='p2']").text(value2);
       // $("[Name='p3']").text(value3);
       // $("[Name='p4']").text(value4);
        $("[Name='t5']").val('$("#box' + value2 + '").animate({height: "300px"});');
       $("[Name='p5']").html(val6);
      $('textarea').val(val2);
    })

   
   ...

CSS

.blue {
    color: blue;
}