JSFiddle - React, Tailwind, and code Playground

by krish reddy

HTML

<h2> 
    This is just an 
    
    <span class="main">
        <span class="one">Example One </span><br>
        <span class="two">Second Example </span><br>
        <span class="third">Third Example </span>
    </span><!-- /.main -->
    
    for something</h2>

CSS

h2{
    font-size: 30px;
}
h2 span.main{
    display: inline-block;
    background-color: #49c8ff;
    color: #fff;
    padding: 5px;
}
    h2 span.main span.two,
    h2 span.main span.third{
       display: none;
    }
    h2:hover span.main span.one{
        display: none;
    }
    h2:hover span.two{
        display: block;
    }