How To Change CSS-classes With Greasemonkey?

I've been trying to gin up a small Greasemonkey script, that takes the content of a class and changes it to another class. Basically it would change:

Solution 1:

This is super-easy with jQuery (a javascript utility/library). jQuery provides the functions addClass() and removeClass(), to make this a snap.

Here is a complete, Firefox Greasemonkey, script that changes that class:

// ==UserScript==
// @name     _Change one class into another.
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @grant    GM_addStyle   
// ==/UserScript==
/*- The @grant directive is needed to work around a design change introduced
    in GM 1.0.   It restores the sandbox.
*/
//-- Get everything that has the class "user_type_1".
var userTypeNodes = $(".user_type_1");

userTypeNodes.removeClass ("user_type_1");
userTypeNodes.addClass ("administrator");