Почему не срабатывает js после обновления страницы оформления заказа woocommerce?

Question

[Владимир]

В wordpress на страницу оформления добавил 2 поля:

1. Селект
2. Инпут

Когда в селекте выбирают "Написать в telegram", к инпуту добавляется display:block и его можно заполнить.
Проблема: Если перезагрузить страницу, то display:block не добавится.

html:

<p id="billing_contactmethod_field" >
	<label for="billing_contactmethod" class="true-label">Предпочитаемый метод связи</label>
	<span class="woocommerce-input-wrapper">
		<select name="billing_contactmethod" id="billing_contactmethod" class="select " data-placeholder="">
				<option value="Позвонить по номеру телефона">Позвонить по номеру телефона</option>
			    <option value="telegram" selected="selected">Написать в Telegram</option>
	    </select>
	</span>
</p>
	
<p class="form-row true-field form-row-wide tg-billing" id="billing_telegram_field">
	<label for="billing_telegram" class="true-label"> Ваш Telegram </label>
	<input type="text" class="input-text " name="billing_telegram" id="billing_telegram" placeholder="Ссылка или название вашего Telegram" value="https://t.me/Ne4aev019">
</p>

Js:

jQuery(document).ready(function($) {	
		$('#billing_contactmethod').on( 'change', function(){
			var selectval= $(this).val(); 
			if( selectval== 'telegram' ) { // Если в селекте выбран "telegram" то показываем поле
				$('.tg-billing').show();
			} else {
				$('.tg-billing').hide();
			}
		});
	});