JSFiddle - React, Tailwind, and code Playground
HTML
<div class="topper">
<h2>Our Menu</h2>
<div class="buttons"><button type="submit" value="vegon">Go Vegetarian</button></div>
<div class="buttons"><button type="submit" value="restoreme">Restore Menu</button></div>
</div>
<div class="middle">
<li>Thai-style Halibut
<ul class="menu_list">
<li >coconut milk</li>
<li class="fish" >pan-fried halibut</li>
<li >lemongrass broth</li>
<li >vegetables</li>
<li >Thai spices </li>
</ul>
</li>
<li>Braised Delight
<ul class="menu_list">
<li class="meat" >lamb shoulder</li>
<li >cippolini onions</li>
<li >carrots</li>
<li >baby turnip</li>
<li >braising jus</li>
</ul>
</li>
<li>House Grilled Panini
<ul class="menu_list">
<li class="meat" >prosciutto</li>
<li >provolone</li>
<li >avocado</li>
<li >cherry tomatoes</li>
<li >sourdough roll</li>
<li >shoestring fries </li>
</ul>
</li>
<li>House Slider
<ul class="menu_list">
<li >eggplant</li>
<li >zucchini</li>
<li class="hamburger">hamburger</li>
<li >balsamic vinegar</li>
<li >onion</li>
<li >carrots</li>
<li >multigrain roll</li>
<li >goat cheese</li>
</ul>
</li> <li>Frittata
<ul class="menu_list">
<li class="meat" >eggs</li>
<li >Asiago cheese</li>
<li >potatoes </li>
</ul>
</li>
<li>Coconut Soup
<ul class="menu_list">
<li >coconut milk</li>
<li class="meat" >chicken</li>
<li >vegetable broth</li>
</ul>
</li>
<li>Soup Du Jour
<ul class="menu_list">
<li class="meat" >grilled steak</li>
<li >mushrooms</li>
<li >vegetables</li>
<li ...
JavaScript
$(".buttons").click(function(){
$("li.fish").hide();
});