JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
      
  </head>
  <body>
    <td>
<select id="mainselect" name="choice1">
<option value="makeChoice" selected="selected">Make a Choice</option>
<option value="pcUpgrade">PC upgrade</option>
<option value="system">System</option>
<option value="network">Network</option>
</select></td>
<td>
<select name="pcUpgrade" id="pcUpgrade" style="display: none;">
    <option>Upgrade Set</option>
    <option>Nieuwe voeding</option>
    <option>Intern geheugen</option>
</select>
</td>
<td>
<select name="choice3" id="system" style="display: none;">
    <option>APK</option>
    <option>Virus verwijderen</option> 
</select>
</td>
<td>
<select name="choice4" id="network" style="display: none;">
    <option>Wi-Fi</option>
    <option>Netwerk installatie</option>    
</select>

</td>
  </body>
</html>

JavaScript

$('#mainselect').change(function() {
    var id = $(this).val();
    if (id === 'makeChoice') {
        $('select').not('#mainselect').hide();
    } else {
        $('#' + id).show();
        $('select').not('#mainselect, #' + id).hide();
    }
});