title: Show div of related checked radio button
body: <p>Trying to show a div when the page loads with a checked radio button.</p>
  
  <p>I have this code which will show a number or input field, depending on the radio clicked:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;p&gt;&lt;input type="radio" name="service" value="auto" checked&gt; Automatic&lt;/p&gt;
  &lt;p&gt;&lt;input type="radio" name="service" value="menu"&gt; Menual&lt;/p&gt;
  
  &lt;div id="auto" value="1" class="details"&gt;
    &lt;p id="demo"&gt;&lt;/p&gt;
  &lt;/div&gt;
  &lt;div id="menu" value="2" class="details"&gt;
    &lt;input name="bizid" type="number" value="" placeholder="Enter number"/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$(document).ready(function() {
      $("div.details").hide();
      $("input[name$='service']").click(function() {
  
        // used for auto service
        Math.floor((Math.random() * 100) + 1);
        var x = document.getElementById("demo")
        x.innerHTML = Math.floor((Math.random() * 100) + 1);
  
        // show div of checked radio on click
        var test = $(this).val();
        $("div.details").hide();
        $("#" + test).show();
      });
  });
  </code></pre>
  
  <p>Here is a <a href="https://jsfiddle.net/y2cp9w5g/" rel="nofollow noreferrer">JSfiddle</a></p>
  
  <p>I want to make this work as needed, so when the page loads it will show the checked div right away.. </p>