Why do people use buttons and other HTML inputs?

Question

With the exception of the text input box, I can't understand why anyone would want to use an HTML input.

It's a nightmare trying to style them in all browsers, and it's much easier to style a normal div like a button, and then utilise jquery's onClick function.

Like this: JSFIDDLE

$('.clickme').hover(function() {
    $(this).animate({"color":"#e8a010","font-size":"52pt"}, 1000);
}, function() {
    $(this).animate({"color":"#fff","font-size":"13px"}, 1000);
});

Why do people use buttons and then try to style them when they can just style a div normally? Is there some advantage? Am I missing something?

Answer 1

Accessibility mostly. button and input elements can be given the focus by using Tab, and then interacted with via the keyboard. A div styled as a button will never receive focus via tabbing.

Whilst this behaviour is not impossible to mimic with non-form elements, you get it for free with them.