title: jQuery-UI Dialog Buttons - pass argument to btn click function
body: <p>I'm a begginer jQuery dev, and I'm using the jQuery UI dialog to show up properties of an object (whatever).</p>
  
  <pre><code>var $dialog = $('&lt;div&gt;&lt;/div&gt;')
      .html('This dialog will show every time!')
      .dialog({
          autoOpen: false,
          title: 'Properties'
      });
  </code></pre>
  
  <p>So this is the dialog, and let's say I have a FOR structure in which I add properties (p tags) and for some of those properties I want a button. </p>
  
  <pre><code>var dialogHtml = "";
  var dialog_buttons = {};
  for (var key in d.properties){
      var str;
      var str = '&lt;p&gt;' + something + '&lt;/p&gt;';
  
      if (condition){
          dialog_buttons[key] = function()
              { functionName(key); };
      }
  
      dialogHtml = dialogHtml + str;
  }
  $dialog.dialog( "option", "buttons", dialog_buttons );
  $dialog.dialog('open');
  </code></pre>
  
  <p>And somewhere else I have the function:</p>
  
  <pre><code>function functionName(key){
      // something something
  }
  </code></pre>
  
  <p>This is where I have the problem: the key variable that's passed to the function... when the button is called the key is the last value from the iteration.
  Let's say we have keys 1, 2, 3, 4 then when the button is clicked, the key parameter will be 4.</p>
  
  <p>I want when I click a button from the dialog, to know <strong>which button was pressed</strong>.</p>
  
  <p>Can anybody help me?</p>
  
  <p>Thanks!</p>