JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<select name="wayfinding-select" class="form-control form-group wayfinding-select">
    <option value=".recs .green .rep">
        Add class active to all 3 divs
    </option>
    <option value=".recs">
        Add class active to RECs div only
    </option>
    <option value=".recs .green">
        Add class active to RECs and Green divs
    </option>
</select>

<div class="wayfinding-btn recs">Renewable Energy Certificates</div>
<div class="wayfinding-btn green hide">Green Programs</div>
<div class="wayfinding-btn rep hide">Renewable Energy Procurement</div>

CSS

.active {
    background-color: red;
    color: white;
    display:block;
}
.hide{
  display:none;
}

JavaScript

$("select[name='wayfinding-select']").change(function() {
    select_changed();
});

function select_changed() {
    jQuery("div[class*='wayfinding-btn']").each(function() {
        jQuery(this).removeClass('active');
		console.log(this);
    });
    jQuery("select[name='wayfinding-select']").each(function() {
        var selected = jQuery(this).val().split(' ');
        $.each(selected, function(index, value) {
            jQuery(value).toggleClass('active');
            jQuery(value).toggleClass('hide');
        });
        console.log(selected);
    });
}