onchange для select

[Mikkey]

Ребят,нужна помощь,сейчас пишу кредитный калькулятор(для тренировки скилов и вообще для общего развития) и хочу реализовать такой функционал(им сейчас особо никто не пользуется но мне просто интересно) Есть у меня выпадающий список select и внутри него варианты срока выплаты кредита - 7лет,10лет,15лет,20лет и вариант "Другое". Как при нажатии на "Другое" реализовать появление под селектом инпута в который можно будет вручную вводить данные? я пишу на нативном js и с jquery пока не работаю, буду благодарен за любую помощь))

[laimas]

<select name="period">
    <option value="">Выберите срок</option>
    <option value="10">10 лет</option>
    <option value="15">15 лет</option>
    <option value="other">Другое</option>
</select>

<script>
document.querySelector('select[name=period]').addEventListener('change', function() {
    if(this.value=='other') {
        let field = document.createElement("input");
        field.name = this.value;
        this.after(field) 
    } else {
        let field = document.querySelector('input[name=other]'); 
        if(field) this.parentNode.removeChild(field)
    }
});</script>

Подразумевается, что созданное поле получая имя как значение опции Другое, отправит значение выбранное для опции, то есть серверу можно проверять наличие ключа other, если нет, значит получаем значение списка.

[Mikkey]

Спасибо,все отлично работает)

[laimas]

все отлично работает

Но в реальной форме вряд-ли такой код нужен.