Родительскому блоку дополнительного содержимого добавьте какой-нибудь класс, чтобы к нему напрямую обращаться можно было, типа
class="subs"
, например.
$('select').change(function() {
$('.subs [class*="sub"]')
.addClass('hidden')
.filter(`.sub${$(this).val()}`)
.removeClass('hidden');
});
// или
$('select').change(function(e) {
const index = ($(e.target).prop('selectedIndex') || Infinity) - 1;
this.addClass('hidden');
this.eq(index).removeClass('hidden');
}.bind($('.subs').children()));
или
document.querySelector('select').addEventListener('change', e => {
const cls = `sub${e.target.value}`;
document.querySelectorAll('.subs [class*="sub"]').forEach(n => {
n.classList.toggle('hidden', !n.classList.contains(cls));
});
});
// или
document.querySelector('select').addEventListener('change', e => {
const index = ~-e.target.selectedIndex;
Array.prototype.forEach.call(
document.querySelector('.subs').children,
(n, i) => n.classList.toggle('hidden', i !== index)
);
});