title: Adding a click event to an element?
body: <p>How can one assign a click event to an arbitrary span (<code>eg. &amp;lt;span id="foo"&gt;foo&amp;lt;/span&gt;</code>) in an ST2 app?  </p>
  
  <p>I have a trivial example that illustrates the idea of what I'd like to do.  In the example, I write the letters <code>A,B,C</code> and I'd like to tell the user which letter they clicked.  </p>
  
  <p>Here's an image:</p>
  
  <p><img src="https://i.stack.imgur.com/dgZDC.png" alt="enter image description here"></p>
  
  <hr>
  
  <p><strong>CODE SNIPPET</strong></p>
  
  <pre><code>Ext.application({
  
      launch: function() {
          var view = Ext.create('Ext.Container', {
  
              layout: {
                  type: 'vbox'
              },
              items: [{
                  html: '&amp;lt;span id="let_a"&gt;A&amp;lt;/span&gt;  &amp;lt;span id="let_b"&gt;B&amp;lt;/span&gt; &amp;lt;span style="float:right" id="let_c"&gt;C&amp;lt;/span&gt;',
                  style: 'background-color: #c9c9c9;font-size: 48px;',
                  flex: 1
              }]
          });
          Ext.Viewport.add(view);
      }
  });
  </code></pre>