JSFiddle - React, Tailwind, and code Playground

HTML

<div class="drop-block">
    <h3>Click this</h3>
    <div class="drop-down">
        <ul>
            <li>Drop</li>
            <li>it</li>
            <li>like</li>
            <li>it's</li>
            <li>hot</li>
       </ul>
    </div>
</div>

CSS

.drop-block h3 {
    color: red;
    background: #c3c3c3;
    width: 100px;
    height: 20px;
    text-align: center;
    cursor: pointer;
}

.drop-down {
    display: none;
}

.drop-block h3.active .drop-down {
    display: block;
}

.drop-block h3.active {
    color: green;
    /* this is where you put your background-position stuff */
}

JavaScript

var dropper = $('.drop-block'); //puts whole block into variable so we don't have to keep using the DOM

$(dropper).find('h3').click(function(){ //binds click to h3
    $(this).toggleClass('active');
    $(dropper).find('.drop-down').toggle();
});