Change

function animate(id……

to

function animateColor(id,element,steps,er,eg,eb,rint,gint,bint,speed,start,end,steps) {

Add at the end of that same procedure:

if (target.step == steps) {

colorFade(id,element,end,start,steps,speed)

}

2. Steps and speed as parameters don't really mean a whole lot. I changed those paramters to duration (in millisecons, not optional) and framesPerSecond (default of 24) so you can specify how smooth the animation is and how long the it should take:
function colorFade(id, element, start, end, duration, framesPerSecond) {
var steps,speed,startrgb,endrgb,er,eg,eb,step,rint,gint,bint;
var target = document.getElementByID(id);
framesPerSecond = framesPerSecond || 24;
steps = framesPerSecond * (duration / 1000);
speed = 1000 / framesPerSecond;
clearInterval(target.timer);
…
}

3. Theres a section in the colorFade function where you're setting color integers, then you check if the value is zero and set to 1 if it is. You could use the Math.max function instead:
rint = Math.max(Math.round(Math.abs(target.r-er) / steps), 1);

4. You should just pass target to the animateColor function instead of id, then you don't need to get the element in the animateColor function.

5. You've got a section in the animateColor function where your checking if the color is >= to the end color and adding or subtracting the increment (and parsing the values [only half the time] when they are already numbers). This could be written as:
var r = target.r;
var g = target.g;
var b = target.b;
r += (rint * (r >= er ? -1 : 1));
g += (gint * (g >= eg ? -1 : 1));
b += (bint * (b >= eb ? -1 : 1));

6. You've got 2 sections in the animateColor function where you're setting the style based of the element. First, you're declaring the color variable before the conditional, so you should remove both sections and move it to after the conditional. Second, change the whole conditional to just set the style of the element that is passed in:
function animateColor(…) {
…
var color;
if (target.step <= steps) {
…
color = 'rgb(' + r + ',' + g + ',' + b + ')';
…
} else {
…
color = 'rgb(' + er + ',' + eg + ',' + eb + ')';
}
target.style[element] = color;
}