Unable to javascript-submit a form using jQuery?

Today we stumbled across the strangest error while making custom submit buttons. We are developing a site that won't depend on javascript for any functionality. This is the way you always should work to make a robust site, though it might sometimes get overlooked. The plan is to first make a functional version which we then extend using javascript.

Our custom buttons are added by a script looping through all button and input elements with the class "button" applied. After these elements an image link is created. An event is hooked on this link, which in case of click, pushes the original button, or if it is a submit button, submits the form.

This all worked very well for all forms but one. After too long time spent Googling and debugging, I discovered the solution! Because the original submit button was named "submit" it wouldn't submit the form. So after renaming it, all was good again! I think it behaves this way because the submit element replaces the submit() function of the form.

Solution: Never ever name a form field "submit", it might just break any javascript!

<!-- BAD -->
<input type="submit" name="submit" />

<!-- GOOD -->
<input type="submit" name="continueButton" />