JSFiddle - React, Tailwind, and code Playground

by steve

HTML

<div id="outer" onclick="toggle()">
    outer
    <div id="inner">
        inner
    </div>
</div>


<script type='text/javascript'>
function toggle() {
  if($('inner').style.display=='block') { 
    $('inner').style.display = 'none'; 
   } 
  else { 
    $('inner').style.display = 'block'; 
   }
}
</script>

CSS

#outer {
    background:red;
    height:50px;
    width:100px;
    cursor:pointer;
}

#inner {
     background:blue; 
     height:30px;
     width:30px;
     display:none;  
}

JavaScript

/*
When I wrote this, Javascript wasn't working on this site, so I put 
the functions in the HTML instead.
*/