<input type="button" />

<button></button>

• What are the main differences between the two, if any?
• Are there valid reasons to use one instead of the other?
• Are there valid reasons to use combine them?
• Does using <button> come with compatibility issues, seeing it is not very widely used?

• Here's a page describing the differences (basically you can put html into a <button></button>)
• And an other page describing why people avoid <button></button> (Hint: IE6)

       And while we're talking about IE, it's got a couple of bugs related to the width of buttons. It'll mysteriously add extra padding when you're trying to add styles, meaning you have to add a tiny hack to get things under control.

$input.disabled = true;

$input.disabled = "disabled";

Answer:

jQuery 1.6+

$("input").prop('disabled', true);
$("input").prop('disabled', false);

jQuery 1.5 and below

$("input").attr('disabled','disabled');

$("input").removeAttr('disabled');

In any version of jQuery

// assuming an event handler thus 'this'
this.disabled = true;

       Note: Do not use this method to remove native properties such as checked, disabled, or selected. This will remove the property completely and, once removed, cannot be added again to element. Use .prop() to set these properties to false instead.