JSFiddle - React, Tailwind, and code Playground

by Shibasish Bhuyan

HTML

<div style="display:inline-block">
<input type="text" value="lable" id="txtID">



<lable id="lbl">lable<span id="spn" style="color:red"></span></lable>


</div>

JavaScript

function fnArr(currArr,chkStat){
console.log(currArr);
for(var i=0;i<currArr.length;i++){
currArr[i]=currArr[i].replace(/[\n\r]/g,"<br/>")
console.log(currArr[i])
spArr=[]
spArr=currArr[i].split("")
console.log(spArr)
if(chkStat){
var t = $('#spn').text();
   if (t.length > 0){
   $('#spn').text(t.substring(0,t.length -1));
   }
}
else
{

}
 
}
}

$('#txtID').keypress(function(e)
{
//  alert(e.keyCode.toString());
if(e.keyCode==8)
{
//alert("alt")
}
else
{
 var s = String.fromCharCode(e.which);
    $('#spn').append(s)
       // console.log(s)
        //console.log(e.keyCode)
}
});

$('#txtID').keyup(function(e)
{
  //alert(e.keyCode.toString());
  var arr= $(this).val().split(new RegExp("\\b"));
 if(e.keyCode==8)
 {
   fnArr(arr,true);
 }
 else
 {
   fnArr(arr,false);
 }
});