바지 눌렀다가 다시 셔츠 누르면 뭔가 이상해지는 문제

자바스크립트로 html 생성하는 강의에서 코딩애플님이 바지를 눌렀다가 셔츠를 누르면 28/30 사이즈가 나오는 오류가 생긴다고 하셨습니다.
근데 저랑 코딩애플님 코드가 같은데 저는 그런 오류가 생기지가 않는데 이러한 오류가 생기지 않는 이유가 무엇인가요??
자바스크립트가 업그레이드 생기면서 문제가 해결된건가요?

// 제가 쓴 코드입니다.

 $('.form-select').eq(0).on('input', function(){
        var value_1 = $('.form-select').eq(0).val();
        if (value_1 == '셔츠') {
            $('.form-select').eq(1).removeClass('form-hide');
         }
        else if(value_1 == '모자') {
            $('.form-select').eq(1).addClass('form-hide');
        }
        else if(value_1 == '바지') {
           $('.form-select').eq(1).removeClass('form-hide');
            $('.form-select').eq(1).html('');
            var value_a = `<option>28</option><option>30</option>`;
            $('.form-select').eq(1).append(value_a);

            
        }
        });
        
// 코딩애플님이 쓴 코드
<script> 
$('.form-select').eq(0).on('input', function(){ 
var value = $('.form-select').eq(0).val(); 
if (value == '셔츠') { $('.form-select').eq(1).removeClass('form-hide'); 
} 
else if (value == '바지'){ 
$('.form-select').eq(1).removeClass('form-hide'); 
$('.form-select').eq(1).html(''); 
var 템플릿 = `<option>28</option><option>30</option>`; 
$('.form-select').eq(1).append(템플릿) } }); 
</script>