title: trying to combine two scripts together with a check box and toggle
body: <p>I have a link when clicked by the user  will <strong><em>uncheck</em></strong> a checkbox.</p>
  
  <p>When the checkbox is unchecked, I want a div to be hidden.  Only when the checkbox is checked the div is displayed.</p>
  
  <p>Both scripts work independently, but together they do not.  When I refresh the page, the link to uncheck the checkbox works correctly but the div is displayed.</p>
  
  <p>I need help to combine these two scripts together to ensure the div is displayed when the checkbox is checked AND the checkbox is unchecked by a link.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;a id="uncheck-all" href="#sharestory2" class="share_cont1"&gt;Continue&lt;/a&gt;
  
  &lt;input  type="checkbox" name="agreeCheckbox" value="Accept" onchange="toggleLink(this);"&gt;
  
  &lt;div class="share_cont_PRO"  id="agreeLink" style="display:none;"&gt;&lt;a href="#sharestory3" class="share_contPRO"&gt;Proceed To Sharing&lt;/a&gt;&lt;/div&gt;
  </code></pre>
  
  <p>SCRIPT:</p>
  
  <pre><code>$(document).ready(function() {
  
  $('#uncheck-all').click(function(){
  $("input:checkbox").attr('checked', false);
    });
  });   
  
  
  
  function toggleLink(checkBox)
   {
  var link = document.getElementById("agreeLink");
  
  if (checkBox.checked)
      link.style.display = "inline";
  else
      link.style.display = "none";
   }
  </code></pre>