JSFiddle - React, Tailwind, and code Playground

by divinemamgai

HTML

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js" ></script>
        <script type="text/javascript">
            $(document).ready(function () {
            $(function () {
            var trigger = 'trigger' ;
            var obj = 'slide' ;
            
            $('.' + trigger).click(function () {
            $('.' + obj).fadeToggle(); 
            }); 
            });
            });
        </script>
        <style>
            div.head
            {
            background: #000;
            opacity: 0.7;
            color: #fff;
            font-weight: bold;
            font-size: 12px;
            font-family: segoe ui;
            padding: 5px 5px; 
            }
            div.head a
            {
            text-decoration: none;
            color: #fff;  
            }
            
            div.slide
            {
            display: none;
            background: #000;
            opacity: 0.7;
            color: #fff;
            font-weight: bold;
            font-size: 12px;
            font-family: segoe ui;
            padding: 5px 5px;  
            }            
        </style>
    </head>
    <body>
        <div class="head">
            <a class="trigger" href="">Click Me!</a>
            <div class="slide">
                Hi Friends!
            </div>
        </div>
    </body>
</html>