JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head><title>bug 5010</title></head>
<body>
    <div id="parent1"><div id="child1">child1</div> parent1</div>
    <br /><br />
    <div id="parent2"><div id="child2">child2</div> parent2</div>
</body>
</html>

JavaScript

$(function(){
   $('#parent1').hide();
   $('#child1').hide();
   $('#parent1').show(); 
   // works as you think it would
    
   $('#parent2').hide();
   $('#child2').toggle(); // technically it's hidden, so it should set to display...
   $('#parent2').show();
    // ambiguous in how you'd expect, and too expensive to work the other way...
});