JSFiddle - React, Tailwind, and code Playground

by adishardis

HTML

<div id="bg"style="float:right;max-width:460px;min-height:365px;background-color:#8f8f8f;border-radius:5px;">
        <div style="float:left;width:90px;margin-right:5px;" >  
        <div id="input" style="float:left;height:25px;width:85px;background-color:#fff;;margin:5px 5px 0px 5px;border-radius:5px;"><p style="margin:5px;text-align:center;">Hide</p></div>
                    <div style="float:left;height:325px;width:85px;background-color:#fff;border-radius:5px;margin:5px;">
            <p style="margin:5px;text-align:center;">Snitt:</p></div>  </div>  
            
        <div id="ett" style="float:left;height:25px;width:360px;background-color:#fff;margin:5px 5px 0px 0px;border-radius:5px;">
            <p style="margin:5px;text-align:center;">Första > Andra > Tredje</p></div>
            
        <div id="två" style="float:right;height:150px;width:350px;background-color:white;border-radius:5px;padding:5px;margin-top:5px;margin-right:5px;"></div>
            
 <div id="tre" style="float:right;height:150px;width:350px;background-color:white;border-radius:5px;padding:5px;margin-top:5px;margin-right:5px;"></div>

JavaScript

$(document).ready(function(){
      // Toggle the visibility of all divs when one is clicked.
    $("#input").click(function() {
        $("#ett").toggle();
        $("#två").toggle();
        $("#tre").toggle();
    });
});