title: jQuery - select all <span> elements and remove their text
body: <p><code>Hello guys</code>, I have spent about twenty minutes searching in vain for my answer, and need your help.  There are thousands of requests for help on how to select elements with jQuery - but everyone wants to do with with some kind of condition, ie, only select an anchor with a certain ID at a certain Y position on the page.</p>
  
  <p>I have a simple request.  How do I select <strong>all</strong> <code>&lt;span&gt;</code> elements on my page and remove their text?</p>
  
  <p>See the thing is, I have a form, and I have <code>&lt;spans&gt;</code>.  When I click the Clear Button input, all fields revert back to default (of course).  But I want the <code>span</code> elements to have their text deleted.</p>
  
  <p>The <code>&lt;html&gt;</code> on it is simple:</p>
  
  <pre><code>&lt;input type="reset" value="Clear form" name="Clear Button" class="clear"&gt;
  </code></pre>
  
  <p>And my jQuery:</p>
  
  <pre><code>/* Clear form - used to revert all Spans back to normal */
  $('#Clear Button').click(function(){
          $('span').val('');
  
  });
  </code></pre>
  
  <p>So, the Reset effect works because that's DOM/HTML.  But my jQuery is sadly broken.</p>
  
  <p>Can anyone tell me what's going wrong?  My script is after the Button declaration, if that helps.</p>