JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="email" />
<input type="text" id="name" />

CSS

#simple_example_window{
    width: 175px;
    
}
#simple_example_window_contents{
    background-color: #003466;
    color:#fff;
    left:60px !important;
    font-family:Helvetica;
    font-size:12px;
    padding: 40px 10px 10px 10px;
    margin-left:-35px;
}
#simple_example_window_beak{
    width: 45px;
    height: 22px;
    background: url('images/arrow.png') top left no-repeat transparent;
}
#simple_example_window_tl, #simple_example_window_tr, #simple_example_window_bl, #simple_example_window_br,
#simple_example_window_t,#simple_example_window_l,#simple_example_window_r,#simple_example_window_b{
    height: 0px;
    width: 0px;
}


/*CSS for example Accordion #slices*/

#slices li {
    margin:0 0 0 0; /*Spacing between each LI container*/
    border-right:1px solid black;
}

#slices li:hover {
    margin:0 0 0 0; /*Spacing between each LI container*/
    
}

#slices li .hpanel {
    padding: 0px; /*Padding inside each content*/
    background: #ccc;
    cursor: hand;
    cursor: pointer;
}

JavaScript

$(function(){
    $('#email').focus(focus).blur(blur)[0].defaultValue="example@email.com";
    $('#name').focus(focus).blur(blur)[0].defaultValue="Type name here";
});

function focus(){
    this.value = (this.value == this.defaultValue)?'':this.value;
}
function blur(){
    this.value = (this.value == '')?this.defaultValue:this.value;
}