JSFiddle - React, Tailwind, and code Playground

by Vaniljs

HTML

<select id="cat">
    <option>Выберите</option>
    <option>Category1</option>
    <option>Category2</option>
</select>


<div id="category1"></div>
<div id="category2"></div>

CSS

div {
        display: none;
        width: 50px;
        height: 50px;
    }
    #category1 {
        background: green;
    }
    #category2 {
        background: blue;
    }

JavaScript

var selectedDevice = null,
      category1 = document.getElementById('category1'),
      category2 = document.getElementById('category2');

function onChangeSelect(select) {
  selectedDevice = this.options[this.selectedIndex].innerHTML;
  selectedDevice == "Category1" ? (category1.style.display = 'block', category2.style.display = 'none') : (category1.style.display = 'none', category2.style.display = 'block')
}

document.getElementById('cat').addEventListener('change', onChangeSelect);