title: How to make one time call to function in jquery
body: <p>I have made a counter $counter and set its limit to 10. Now After Making a click on screen, I am adding div tag and increasing counter by 1. But along with that I have added a close button on each div and decreasing counter by 1 on each click on div.close. But due to same class .close. But the counter decreases many times in one click. </p>
  
  <pre><code>$(canvas).click(function() {
      $counter++;
      if($counter&lt;10)
      $("#color-swatch").prepend("&lt;div&gt;"+color+"&lt;div class='close'&gt;&lt;/div&gt;&lt;/div&gt;");
      $(".close").click(function()
      {
          $(this).parent().remove();
          $counter--;
          console.log($counter);
  
      });
  });
  </code></pre>
  
  <p>Output of console on just one click on close div.</p>
  
  <p>10
  9 
  8 
  7
  6</p>