JSFiddle - React, Tailwind, and code Playground

by LW

HTML

<select name="" id="drop_down">
    	<option value="choose">Please choose</option>
    	<option value="Allure">Allure</option>
        <option value="Elle">Elle</option>
        <option value="In-Style">In-Style</option>
        <option value="other">Other</option>
    </select>
<input type="text" name="fields_where" id="other" placeholder="Other"/><br id="otherBR" />
<input type="text" name="fields_where_2" id="In-Style" placeholder="In-Style"/><br id="otherBR2" />

CSS

#other{
    display:none;
}
#otherBr{
    display:none;
}
#In-Style{
    display:none;
}
#otherBr2{
    display:none;
}

JavaScript

function showOther(){
	document.getElementById('other').value = "";
	document.getElementById('other').style.display = 'block'; 
	document.getElementById('otherBR').style.display = 'block';
}

function hideOther(){
	document.getElementById('other').style.display = 'none'; 
	document.getElementById('otherBR').style.display = 'none';
}
function showOther2(){
	document.getElementById('In-Style').value = "";
	document.getElementById('In-Style').style.display = 'block'; 
	document.getElementById('otherBR2').style.display = 'block';
}

function hideOther2(){
	document.getElementById('In-Style').style.display = 'none'; 
	document.getElementById('otherBR2').style.display = 'none';
}

$('#drop_down').on('change', function(){
    ($(this).val() == 'other') ? showOther() : hideOther();
    ($(this).val() == 'In-Style') ? showOther2() : hideOther2();
        
});