JSFiddle - React, Tailwind, and code Playground

HTML

<h4>How to apply</h4>

    <select id="apply">
        <option value="email">Email</option>
        <option value="website">Website</option>
    </select>
    <input type="text" class="input" id="email" placeholder="[email protected]" data-id="application" />
    <input type="text" class="input" id="website" placeholder="www.example.com" data-id="application" />

<div id="application"></div>

CSS

.hidden {
    display: none;
}

JavaScript

function applyField() {
        $(document).on('change', '#apply',function() {
            var selected = $(this).find(':selected').val(),
                elem = $("#"+selected);
            $('[data-id="application"]').addClass('hidden').prop('disabled', true).val('');
            elem.removeClass('hidden').prop('disabled', false);
        });
        $("#apply").trigger('change');
    };


    function fieldPreview() {
        $('.input').on('change paste keyup input', function () {
            $('#' + $(this).data('id')).html(this.value);
        });
    }

    jQuery(function ($) {
        applyField();
        fieldPreview();
    });