JSFiddle - React, Tailwind, and code Playground

HTML

<div id="post-todo" tabindex="0">
      <span class="add-on">OK</span>
      <input class="addtodo" placeholder="New todo task" name="TITLE"  type="text" >
 </div>

CSS

#post-todo span{   
     color:#aaa;
 }

JavaScript

$("#post-todo .addtodo").focus(function(){
    $("#post-todo .add-on").css("color", "#ff00ff");
})

$("#post-todo .addtodo").blur(function(){
    $("#post-todo .add-on").css("color", "#aaa");
})