JSFiddle - React, Tailwind, and code Playground

HTML

<select id="soc-tab-nav">
         <option selected>1</option>
         <option>2</option>
          <option>3</option>
          <option>4</option>
</select>
<div style="display:block">1</div>
<div>2</div>
<div>3</div>
<div>4</div>

CSS

div {
    display: none;
}

JavaScript

document.getElementById('soc-tab-nav').onchange = function () {
    var divs = document.getElementsByTagName('div');
    for (var i = 0; i < divs.length; ++i) {
         divs[i].style.display = 'none';
    }
    divs[this.value - 1].style.display = 'block';
}