title: jQuery - Disable href based on checkbox - Location of script?
body: <p>Not sure what I am doing wrong, but I am very much a novice with javascript and html so probably a lot.  I am trying to enable / disable an href link based on the selection of the check box.  Here is the code:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;Page Title&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"/&gt;
  &lt;meta http-equiv="keywords" content="keyword1, keyword2" /&gt;
  &lt;meta http-equiv="description" content="Description of Page" /&gt;
  &lt;link href="css/style.css"rel="stylesheet" type="text/css" /&gt;
  &lt;style type="text/css"&gt;
  .auto-style1 {
      font-size: 12px;
      color: #4d4d4d;
      line-height: 2em;
      margin: 5px;
      padding: 0;
      text-align: center;
  }
  .auto-style2 {
      text-align: center;
  }
  .auto-style3 {
      font-family: Neogrey;
  }
  &lt;/style&gt;
  &lt;script type="jQuery"&gt;
  $('#link').click(function(){return false; });
  $('#check').click(function() {
    if(!$(this).is(':checked')){
      $('#link').bind('click', function(){ return false; });
    }else{
      $('#link').unbind('click');
    }
  });&lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div class="auto-style2"&gt;
  &lt;form id="form1" runat="server"&gt;
  &lt;div class="logo"&gt;&lt;h1 class="auto-style3"&gt;
  &lt;/h1&gt;&lt;/div&gt;
  &lt;h2 class="head"&gt;Header Text&lt;/h2&gt;
  &lt;div class="auto-style1"&gt;
  Welcome Text.&lt;br /&gt;
  &lt;input type="checkbox" id="check"/&gt;&lt;label for="check"&gt;I accept the &lt;a href="TC.html"&gt;Terms of Service&lt;/a&gt;.&lt;/label&gt;
  &lt;br /&gt;
  &lt;a href="http://www.google.com" id="link"&gt;
  &lt;img alt="" height="30" src="images/download.png" width="100" /&gt;&lt;/a&gt;&lt;br /&gt;
  
  &lt;/div&gt;
  &lt;div class="footer"&gt;
  &lt;div class="menu"&gt;
  &lt;a href="iOS-TC.html"&gt;iOS&lt;/a&gt;
      &lt;a href="android-TC.html"&gt;Android&lt;/a&gt;
      &lt;a href="blackberry-TC.html"&gt;Blackberry&lt;/a&gt;
      &lt;a href="http://www.yahoo.com"&gt;Support&lt;/a&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/form&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any help is greatly appreciated!</p>