Here are a few quick easy jquery functions that will add a class of 'changed' to any input or select box if it is changed, and will remove that class if the value is reset to the default.

view plain print about
1// inputs
2        $('form.myForm :input').change(function(){
3        var defval = $(this)[0].defaultValue;
4        if ($(this).val()!=defval){
5            $(this).addClass('changed');
6        } else {
7             $(this).removeClass('changed');
8        }
9        }).keyup(function(){
10             $(this).trigger('change');
11        });
12
13        // select boxes
14        $('form.myForm select').change(function(){
15        var defval = $(this).find('option[defaultSelected=true]').val();
16        if ($(this).val()!=defval){
17            $(this).addClass('changed');
18        } else {
19             $(this).removeClass('changed');
20        }
21        }).keyup(function(){
22             $(this).trigger('change');
23        });

Note in both cases we use keyup (onkeyup) to trigger the 'change' event. This allows the browser to show the changed class as soon as the user changes the value using a keyboard, rather than 'onblur'.