title: jQuery Click and default behavior
body: <p>I have a series of image upload buttons on a page, and they clutter the page up on page load. What I'd like to do is hide all but the first, and then upon clicking the "Upload" button, the next upload form shows. </p>
  
  <p>my current jQuery code is:</p>
  
  <pre><code>jQuery( '.product-option:not(:first)' ).addClass( "hidden" );
  
  jQuery( '.image-upload' ).click(function(){
      jQuery( '.product-option' ).next().removeClass( "hidden" );
  });
  </code></pre>
  
  <p>Now the function to hide all but the first is working just fine. The click function works just fine if I put it on any element other than the actual button. When I put it on the button, it doesn't work. Also, if I try to put it on the general div or form, the click area doesn't cover the entire form, just the top of the div. This applies even if I set overflow: hidden.</p>
  
  <p>I think it must have something to do with default behavior, but I'm not certain. Does anyone have any ideas?</p>