title: jQuery - Disable live click event for particular td
body: <p>I got a table and i assign the click event via .live() to each td (id="min") in every row</p>
  
  <p>View:</p>
  
  <pre><code>            &lt;td id="min"&gt;
                  @Html.Action("GetMinAmount", "Stock", new { id = item.FoodID })
              &lt;/td&gt;      
  </code></pre>
  
  <p>Controller (to display either image or amount)</p>
  
  <pre><code>     // Function to return min amount, if null return "-"
      public string GetMinAmount(int id)
      {
          var food = dbEntities.FOODs.Single(f =&gt; f.FoodID == id);
          string output = "";
          if (food.MinAmount == null)
          {
              output += "&lt;img id=\"disable\" src=\"../../Content/Add_in_Images/disable.png\" alt=\"disable\" style=\"background-image: none\"/&gt;";
          }
          else
          {
              return food.MinAmount.ToString();
          }
          return output;
      }
  </code></pre>
  
  <p>Script:               </p>
  
  <pre><code>       $('#min').live('click', function () { $editdialog.dialog('open'); });
  </code></pre>
  
  <p>But inside the td I can have 2 conditions, one is the "enabled" state which showing the Amount where user can click and edit the amount. If the amount is null, an icon will be displayed and user cannot do anything with it. </p>
  
  <p>Currently I cant remove the click handler for the disabled image. So even the td which suppose to be disabled is clickable also...</p>
  
  <p>I got no idea how can i remove the click handler for the "disabled" td only.</p>
  
  <p>Anyone can help??? Thanks.......</p>