title: Jquery plugin click events
body: <p>I've been learning and trying to create my own jQuery plugin by following examples and tutorials online.</p>
  
  <p>I have a plugin started that is called on each table row but my click event runs for each <code>&lt;tr&gt;</code> in the table.</p>
  
  <p>How can i get it so my plugin's click events only happen for the <code>&lt;tr&gt;</code> that is clicked?  </p>
  
  <p>The plan is once I have it working properly to update some divs with some content related to the <code>&lt;tr&gt;</code> and the button actions need to do something with the data also such as remove the parent <code>&lt;tr&gt;</code></p>
  
  <pre><code>(function ($) {
      "use strict";
  
      $.quote = function(el, options) {
          var base = this;
  
          base.options = {};
  
          base.$el = $(el);
          base.el = el;
  
          base.$el.data('quote', base);
  
          function debug(e) {
              console.log(e);
          }
  
          base.init = function() {
              base.options = $.extend({}, $.quote.defaultOptions, options);
              //var quotes = '';
          };
  
          base.convert = function(e) {
              debug(e);
          };
  
          base.ditch = function(e) {
              debug(e);
          };
          base.updateForm = function(e) {
              base.options.buttonPress.call( this );
          }
  
          base.init();
      };
  
      $.quote.defaultOptions = {
          buttonPress: function() {
              alert('hello');
          }
      };
  
      $.fn.quote = function(options) {
          return this.each(function() {
              var qt = new $.quote(this, options);
  
              $('button[name="convert"]').click(function(e) {
                  qt.convert(e);
              });
              $('button[name="ditch"]').click(function(e) {
                  qt.ditch(e);
              });
              $('.widget td:not(.td-actions)').click(function(e) {
                  qt.updateForm(e);
              });
          });
      };
  })(jQuery);
  
  $(function () {
       $('tr').quote();
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;tr&gt;
      &lt;td&gt;&lt;/td&gt;
      &lt;td&gt;&lt;/td&gt;
      &lt;td class="td-actions"&gt;&lt;button name="convert" class="btn btn-small btn-success"&gt;&lt;i class=" fa fa-check"&gt; &lt;/i&gt;&lt;/button&gt;&lt;button name="ditch" lass="btn btn-danger btn-small"&gt;&lt;i class=" fa fa-remove"&gt; &lt;/i&gt;&lt;/button&gt;&lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>