title: How do I add a $( document ).ready() function to this script?
body: <p>I tried reading and inserting the document function in this code but I have no idea what im doing. Can someone tell where I should put the document initialization and why? this would be of great help. thanks.</p>
  
  <p>Here's a <a href="https://jsfiddle.net/zLnroomd/2/" rel="nofollow">fiddle</a> of what the jquery is for</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $('.quantity, .drink').change(calculateTotal);
  function calculateTotal() {
      var $form = $(this).closest('form'), total = 0;
      $form.find('.drink:checked').each(function() {
          total += $(this).data('price') * parseInt($(this).next('.quantity').val() || 0, 10);
      });
  
      $('#totalDiv').text(total);
  }
  &lt;/script&gt;
  </code></pre>