title: jQuery Click Function not Working on Class
body: <p>So I have a bunch of game pieces that I want to be clickable.  If I add a click function to a button I get the desired result, but when I add it to the game piece class, it fails to work.  </p>
  
  <p>Here is an example that works fine on jsfiddle, but not when I use it in my script:
  <a href="http://jsfiddle.net/sLt7C/" rel="noreferrer">http://jsfiddle.net/sLt7C/</a></p>
  
  <p>Here is what I want to do on my page:</p>
  
  <pre><code>$('.gamePiece').click(function(){
      $('.gamePiece').addClass("toggled");
  });
  </code></pre>
  
  <p>This doesn't work, but if I switch the identifier to a button on the page it does work:</p>
  
  <pre><code>$('#btn_AddClass').click(function(){
      $('.gamePiece').addClass("toggled");
  });
  </code></pre>
  
  <p>What could be causing this to fail?</p>
  
  <p>Not sure if this has any impact on what could be causing it to fail, but the "game pieces" are span elements that are generated after clicking a "New Game" button.</p>
  
  <p>Here is a fiddle showing more code <a href="http://jsfiddle.net/sLt7C/4/" rel="noreferrer">http://jsfiddle.net/sLt7C/4/</a></p>
  
  <p>For further clarification:</p>
  
  <p>This doesnt work</p>
  
  <pre><code>$('.gamePeice').click(function(){
      $(this).addClass("toggled");
  });
  </code></pre>
  
  <p>This works</p>
  
  <pre><code>$('#btn_addClass').click(function(){
      $('.gamePeice').addClass("toggled");
  });
  </code></pre>