collapsing div

by Matthew Day

HTML

<div class="fishes">
    <div class="fish-name">Tuna</div>
    <div class="fish-tastiness">High</div>
</div>

<div class="fishes">
    <div class="fish-name">Salmon</div>
    <div class="fish-tastiness">Higher</div>
</div>

CSS

* {
    box-sizing: border-box;
}
.fishes {
    color: gray;
    margin-bottom: 40px;
}
.fish-name {
    text-transform: uppercase;
}

.fish-tastiness {
    display: none;
}

JavaScript

$('.fish-name').click(function(){
    $(this).next().slideToggle();
});