How to display the text fields when choosing different option from the selectoption (if select USA option USA text field need to show)?
<select name="cntry">
<option value="us">USA</option>
<option value="uk">uk</option>
</select >
<input type="text" value="USA" name="USA">
<input type="text" value="UK" name="UK">
$('#country').on('change', function() {
$('input').each(function() {
$(this).css('display', 'none');
});
if (this.value === 'us') {
$('input[name="USA"]').css('display', 'initial')
}
if (this.value === 'uk') {
$('input[name="UK"]').css('display', 'initial')
}
});input {
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="country" name="cntry">
<option selected disabled hidden>Select your Country</option>
<option value="us">USA</option>
<option value="uk">uk</option>
</select>
<input type="text" value="USA" name="USA">
<input type="text" value="UK" name="UK">