title: Use jQuery On Click to Change Text Inside Span
body: <p><strong>EDIT: I'm a fool. I didn't have jQuery loaded on my jsFiddle. I thought it automatically came loaded with a new Fiddle. Please disregard.</strong></p>
  
  <p>Alright, I've been trying to get this to work and can't for the life of me figure it out. I'm sure it's something insanely easy and I'm just not seeing it. </p>
  
  <p>I have a span with pre-populated text inside of it. I want to click the button and change the text inside of the span to something else. Then I want to click the other button and change the text again.</p>
  
  <p>Any thoughts? Thanks!</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div&gt;
      &lt;button id="bye"&gt;Bye&lt;/button&gt;
      &lt;button id="hello"&gt;Hello&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
      &lt;p&gt;1: &lt;span id="greeting"&gt;Greeting&lt;/span&gt;&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>$('#hello').on('click', function() {
      $('#greeting').text('Hello');
  });
  $('#bye').on('click', function() {
      $('#greeting').text('Bye');
  });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/yxs0pppj/6/" rel="nofollow">JSFIDDLE</a></p>