title: How to add the checked input box in input text whether onload or onclick using jquery
body: <p>Im getting the result now, but what I want is to <strong>Also</strong> get the <code>checked</code> input box and put into the input text not just only using <code>on change</code> event in jQuery but also on page loads. As you can see, one of the checkboxes below has been checked but not putting into the input text. Please see my code below:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){
      $checks = $(":checkbox");
      $checks.on('change', function() {
          var string = $checks.filter(":checked").map(function(i,v){
              return this.value;
          }).get().join(",");
          $('#field_results').val(string);
      });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  
  &lt;div class="multiple"&gt;
    &lt;input type="text" id="field_results"/&gt;&lt;br&gt;
  
    &lt;input type="checkbox" value="1" checked&gt;1&lt;br&gt;
    &lt;input type="checkbox" value="2"&gt;2&lt;br&gt;
    &lt;input type="checkbox" value="3"&gt;3
  &lt;/div&gt;
  
  
  &lt;div class="multiple"&gt;
    &lt;input type="text" id="field_results"/&gt;&lt;br&gt;
  
    &lt;input type="checkbox" value="1"&gt;1&lt;br&gt;
    &lt;input type="checkbox" value="2" checked&gt;2&lt;br&gt;
    &lt;input type="checkbox" value="3"&gt;3
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>