Show or Hide a Select with jQuery and on load hold the field hide

functions.php

<?php
/** Function to Show or Hide a field */
function wcv_show_custom_field_time_warranty()
{
    ?>
<script>
    jQuery(function ($) {
        if ($('#wcv_custom_product_warranty').val() == 'No') { //'.val()'
            $("#wcv_custom_product_time_warranty").hide();
            $("label[for='wcv_custom_product_time_warranty']").hide();
            $('#wcv_custom_product_time_warranty').val('');
        }

        $("#wcv_custom_product_warranty").change(function () {
            var val = $(this).val();
            if (val === "Yes") {
                $("#wcv_custom_product_time_warranty").show();
            } else if (val === "No") {
                $("#wcv_custom_product_time_warranty").hide();
                $("label[for='wcv_custom_product_time_warranty']").hide();
                $('#wcv_custom_product_time_warranty').val('');
            }
        });
        <?php
}
add_action('wp_footer', 'wcv_show_custom_field_time_warranty');
?>
     
<!--Html file-->
<div class="control-group">
  <label for="wcv_custom_product_warranty">Warranty</label>
  <div class="control select">
    <select id="wcv_custom_product_warranty" name="wcv_custom_product_warranty" class="select" style="" required="1">
      <option value="No" selected="selected">No</option>
      <option value="Yes">Yes</option>
     </select> 
   </div>
 </div>
 <div>
  <div class="time-warranty all-100 small-100"><div class="control-group">
    <label for="wcv_custom_product_time_warranty" class="time-warranty all-100 small-100" style="display: none;">Product Time of Warranty</label>
      <div class="control">
        <input type="number" class="" style="" name="wcv_custom_product_time_warranty" id="wcv_custom_product_time_warranty" value="" placeholder="Insert the Product Time of Warranty in Days"> 
      </div>
     </div>
   </div>
 </div>