Q:

Prevent the duplicate function onchange event jQuery

I have this snippet below

$(document).ready(function(){
  $("#selectTest").change(function(e){
    if($(this).val() == "01"){
      $(".show").hide();
    }else{
      $(".show").show();
    };
  })
})
<! DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
    <div class="show">
        Sample Text
    </div>
    <select name="test" id="selectTest">
        <option value="00"></option>
        <option value="01">Click this to hide text</option>
        <option value="02">Click this to show text</option>
    </select>
</body>
</html>

Above snippets looks fine, but i am getting trouble when the option where selected from the first when the page loaded.  I have to click the different button to make the hide function works.  I solved that problem by adding the if ... else in my code so that when the page loaded the hide function will run properly. 
$(document).ready(function(){
  $("#selectTest").change(function(e){
    if($(this).val() == "01"){
      $(".show").hide();
    }else{
      $(".show").show();
    };
  })

   if($("#selectTest").val() == "01"){
      $(".show").hide();
    }else{
      $(".show").show();
    };
})

Above code looks not appropriate because i have to repeat the function that i have made, is there any better way to resolved this problem ? 

A:

Instead of writing code twice, you can trigger the event (change) using jQuery's .trigger():
$("#selectTest").trigger('change');

Working Code Example:

$(document).ready(function(){
  $("#selectTest").change(function(e){
    if($(this).val() == "01"){
      $(".show").hide();
    }else{
      $(".show").show();
    };
  });
 $("#selectTest").trigger('change');
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="show">
    Sample Text
</div>
<select name="test" id="selectTest">
    <option value="00"></option>
    <option value="01">Click this to hide text</option>
    <option value="02">Click this to show text</option>
</select>

