أريد إخفاء أو إظهار حقول التسجيل registration بناءًا على إختيار حقل معين في مشروع PHP

اذا اردت الاظهار والاخفاء بناء علي رغبة المستخدم يجب عليك عمل الاتي في الكود :

add_action('woocommerce_register_form_start', 'text_domain_woo_reg_form_fields');
function text_domain_woo_reg_form_fields() {
    ?>
    <p class="form-row form-row-first">
        <label for="billing_company"><?php _e('Name Company', 'text_domain'); ?><span class="required">*</span></label>
        <input type="text" class="input-text" name="billing_company" id="billing_company" value="<?php if (!empty($_POST['billing_company'])) esc_attr_e($_POST['billing_company']); ?>" />
    </p>
    <p class="form-row form-row-last">
        <label for="billing_product"><?php _e('Company Product', 'text_domain'); ?><span class="required">*</span></label>
        <input type="text" class="input-text" name="billing_product" id="billing_product" value="<?php if (!empty($_POST['billing_product'])) esc_attr_e($_POST['billing_product']); ?>" />
    </p>
    <div class="clear"></div>

    <?php
}

add_action('wp_footer', 'custom_registration_script');
function custom_registration_script() {
    ?>
    <script type="text/javascript">
        jQuery(document).ready(function($){
            $('#reg_role').change(function() {
                var selectedRole = $(this).val();
                if (selectedRole == 'subscriber') {
                    $('#billing_company').hide();
                    $('#billing_product').show();
                } else {
                    $('#billing_company').show();
                    $('#billing_product').hide();
                }
            });
        });
    </script>
    <?php
}

add_action('woocommerce_register_form', 'wc_extra_registation_fields');
function wc_extra_registation_fields() {
    ?>
    <p class="form-row form-row-first">
        <label for="reg_role"><?php _e('Agent?', 'woocommerce'); ?></label>
        <select class="input-text" name="role" id="reg_role">
            <option <?php if (!empty($_POST['role']) && $_POST['role'] == 'customer') esc_attr_e('selected'); ?> value="customer">Client</option>
            <option <?php if (!empty($_POST['role']) && $_POST['role'] == 'subscriber') esc_attr_e('selected'); ?> value="subscriber">Agent</option>
        </select>
    </p>
    <?php>
}

التعديلات التي قمنا بها هي الاتي : 

1- تغيير keyup  ب change   حيث ان change تقوم  بالعمل عند تغيير قيمة عنصر الإدخال (بما في drop down list).

2-  اضافة  wp_footer  من اجل ضمان تحميل مكتبة ال jQuery  و ال form