JSFiddle - React, Tailwind, and code Playground

HTML

<form>
        <select id="sel[]">
            <option value="">- select -</option>
            <option value="option1">Option 1</option>
            <option value="option2">Option 2</option>
            <option value="option3">Option 3</option>
            <option value="option4">Option 4</option>
            <option value="other">Other</option>
        </select>  
        <label class="option1" for="option1">Textbox Label 1</label><input type="text" class="option1" />
        <label class="option2" for="option2">Textbox Label 2</label><input type="text" class="option2" />
        <label for="option2">Textbox Label 2</label><input type="text" class="option2" />
        <label for="option2">Textbox Label 2</label><input type="text" class="option2" />        
        <label for="option3">Textbox Label 3</label><input type="text" class="option3" />
        <label for="option3">Textbox Label 3</label><input type="text" class="option3" />        
        <label for="option4">Textbox Label 4</label><input type="text" class="option4" />
        <label for="other">Other</label><input type="text" class="other" />
    </form>

CSS

input {
    display: none;
    margin-bottom: 10px;
}

label {
    display: none;
}

JavaScript

$(function() {
        $('#sel\\[\\]').change(function() {
            $('label[for^="option"], label[for^="other"], input[class^="option"], input[class^="other"]').hide();
            $('.' + $(this).val() +', label[for=' + $(this).val() + ']').fadeIn('500');
        });
    });