jQuery 2.1 | Trigger function after delay in textarea - timer

Question

I use this to trigger a function once a pause in typing is initiated in a textarea:
var keyTimer;
$("#TEXTAREA").on('keyup mouseup', function(){
if (keyTimer) {
clearTimeout(keyTimer);
}
keyTimer = setTimeout(function () {
doFunction(); // Not working, triggers only once (on focus).
}, 500);
});
doFunction() triggers only at first keyup pause (on focus). That function must trigger at every pause (500). Now I need to blur TEXTAREA, then focus it again to reactivate doFunction() which is useless for me. Any solution greatly appreciated.
UPDATE:
Updated the code:
var keyTimer;
$("#TEXAREA").on('keyup mouseup', function(){
if (keyTimer) {
clearTimeout(keyTimer);
}
keyTimer = setTimeout(function () {
doFunction(); // Formulates a string
$("#TEXAREA").trigger('change');
}, 500);
}).on('change', function(){
alert('test'); // This triggers at every keyup/mouseup delay (500)
// This section of code must work after delay (500), but it doesn't,
// it only works on Textarea blur, which is not what I want:
var txtarea = $(this);
var livecount = $("#myValue").val(); // Comes from doFunction()
if ( livecount.length > 2800 ) {
txtarea.css('color','#C00'); // Change text color of textarea
} else if ( livecount.length <= 2800 ) {
txtarea.css('color','#000'); // Change text color of textarea
}
});

Answer 1

it looks like the only think in your code that is missing is the selector that you are using in the doFunction. You are using #myValue but are actually looking for the value inside of the #TEXTAREA. Here is my jsfiddle
function doFunction(){
console.log('not a test')
}
var keyTimer;
$("#TEXAREA").on('keyup mouseup', function(){
if (keyTimer) {
clearTimeout(keyTimer);
}
keyTimer = setTimeout(function () {
doFunction(); // Formulates a string
$("#TEXAREA").trigger('change');
}, 1000);
}).on('change', function(){
console.log('test'); // This triggers at every keyup/mouseup delay (500)
// This section of code must work after delay (500), but it doesn't,
// it only works on Textarea blur, which is not what I want:
var txtarea = $(this);
var livecount = $("#TEXAREA").val(); // Comes from doFunction()
if ( livecount.length > 2800 ) {
txtarea.css('color','#C00'); // Change text color of textarea
} else if ( livecount.length <= 2800 ) {
txtarea.css('color','#f00'); // Change text color of textarea
}
});

Answer 2

UPDATE - FINAL
Ok, got it working finally:
var keyTimer;
$("#TEXTAREA").on('keyup mouseup', function(){
$(this).change(); // Need this to update keyboard character input
}).on('change', function(){
if (keyTimer) {
clearTimeout(keyTimer);
}
keyTimer = setTimeout(function () {
doFunction(); // Formulates a string
}, 200); // Delay before doFunction() so it won't slow down keyboard input
var livecount = $("#myValue"); // String value from doFunction()
if ( livecount.val().length > 2800 ) {
$(this).css('color','red'); // Change textarea text color to red for overlimit
} else if ( livecount.val().length <= 2800 ) {
$(this).css('color','black'); // Change textarea text color to black for within limit
}
});
It was a long day ;-)