I know you already have a solution from 'DeathShadow',
but only for completeness of your question, here is an answer.
Note: It does require a bit of consistency in the formatting of your statements.
For example, it will not recognize 'if(' but does highlight correctly 'if ('
and 'for(' is not highlighted correctly unless typed 'for ('
Also 'shiftit(' does display correctly regardless of the case of the letters (upper-case or lower-case)
because there is no testing of the case of the letters in the replace function.
I would stick with 'DeathShadow's code unless it is too difficult to decipher.
Until then you could use mine as a backup as you study and learn from his/her code.
Good Luck!

Whoops. Forgot to include code change...
<!DOCTYPE HTML>
<html>
<head>
<title>pedroduino.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="image/x-icon" href="/custom pd/images/arduino.ico" rel="shortcut icon">
<link media="screen" type="text/css" href="style.css" rel="stylesheet">
<style type="text/css" media="all">
.thewordBlue { color:#006699; }
.thewordRed { color:#CC6600; }
.thewordLogic { color:green; }
.textInfo { position:absolute; top:40px; left:140px; }
.scrollBox {
position:absolute; top:150px; left:92px; border:1px solid #33CC33;
background-color:#F6F6E3; width:850px; height:480px; padding:0 30px;
overflow-y:scroll; overflow-x:scroll;
}
</style>
</head>
<body>
<div id="content" style="height:1000px;">
<!--CONTENT GOES HERE-->
<div class="textInfo">
<br>This is some text int that may contain void loop some full or partial void keywords that I do not want the js replace script to change
<p><pre>int char void setup pinMode void loop for digitalWrite else delay HIGH LOW OUTPUT</pre>
</div>
<!--POSITION SCROLL BOX-->
<div class="scrollBox">
<p style="width:250%;">
<pre id="preText"> <!-- ARDUINO CODE -->
***************************************************************************
// 7-SEGMENT LED COUNTER, MULTIPLEXING USING 74HC595 8-BIT SHIFT REGISTER,
// INCREMENT COUNTER ZERO TO NINE TO ZERO VIA POTENTIOMETER
// Code mangled together from these sources - thanks fellas
// http://www.sweeting.org/mark/blog/20...nt-led-display
// http://thecustomgeek.com/2011/06/29/...-a-7-year-old/
// http://nootropicdesign.com/projectla.../25/led-clock/
const int latchPin = 5; // PIN CONNECTED TO PIN 12 OF 74HC595 (LATCH)
const int dataPin = 6; // PIN CONNECTED TO PIN 14 OF 74HC595 (DATA)
const int clockPin = 7; // PIN CONNECTED TO PIN 11 OF 74HC595 (CLOCK)
int counter = 0; // INITIALISE COUNTER AS ZERO
int potReading = 0;
// DESCRIBE EACH DIGIT IN TERMS OF DISPLAY SEGMENTS 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
const byte numbers[10] =
{
B11111100,
B01100000,
B11011010,
B11110010,
B01100110,
B10110110,
B10111110,
B11100000,
B11111110,
B11100110,
};
void setup() {
pinMode(latchPin, OUTPUT); // SET SR PINS TO output
pinMode(clockPin, OUTPUT);
pinMode(dataPin, OUTPUT);
}
void loop() {
potReading = analogRead (A0);
potReading = map(potReading, 0, 1023, 0, 8);
{
if (potReading > 8) potReading --;
show(numbers[potReading]);
}
{
if (potReading < 0) potReading ++;
show(numbers[potReading]);
}
}
void show( byte number) {
// USE A LOOP AND A BITWISE AND TO MOVE OVER EACH BIT THAT MAKES UP
// THE SEVEN SEGMENT DISPLAY (FROM LEFT TO RIGHT, A => G), AND CHECK
// TO SEE IF IT SHOULD BE ON OR NOT
for (int j = 0; j <= 7; j++) {
byte toWrite = number & (B10000000 >> j);
if (!toWrite) { continue; } // IF ALL BITS ARE 0 THEN NO POINT WRITING IT TO THE SHIFT REGISTER,SO BREAK OUT AND MOVE ON TO NEXT SEGMENT.
shiftIt(toWrite); // OTHERWISE SHIFT IT INTO THE REGISTER
}
}
void shiftIt (byte data) {
digitalWrite(latchPin, LOW); // SET latchPin Low WHILE CLOCKING THESE 8 BITS IN TO THE REGISTER
for (int k=0; k <= 7; k++) {
digitalWrite(clockPin, LOW); // CLOCKPIN Low PRIOR TO SENDING A BIT
// NOTE THAT IN OUR CASE, WE NEED TO SET PINSTATE TO 0 (Low) FOR
// “ON” AS THE 74HC595 IS SINKING CURRENT WHEN USING A COMMON
// ANODE DISPLAY. IF YOU WANT TO USE A COMMON CATHODE DISPLAY THEN
// SWITCH THIS AROUND.
if ( data & (1 << k) ) {
digitalWrite(dataPin, HIGH); // TURN"ON"
} else {
digitalWrite(dataPin, LOW); // TURN "OFF"
}
digitalWrite(clockPin, HIGH); // AND CLOCK THE BIT IN
}
digitalWrite(clockPin, LOW); // STOP SHIFTING OUT DATA
digitalWrite(latchPin, HIGH); // SET latchPin TO High TO LOCK AND SEND DATA
}
</pre>
// demonstration of a DIFFERENT code block
<pre id="postText">
void displayLogicCode (byte info) { // Non-sense code for_display DEMO ONLY
shiftit(info);
switch (info) {
case 0: shiftit(info); break;
case 0: shiftit(info * 2); break;
case 0: shiftit(info * 4); break;
default: break; // do nothing
}
}
</pre>
</p>
</div>
<!--CLOSE STYLE DIV FOR SCROLL BOX-->
</div> <!-- CONTENT ENDS HERE -->
<script type="text/javascript">
function highlightArduinoCode(IDS) {
var preText = document.getElementById(IDS).innerHTML;
var logicWords = ['if ','else ', 'switch ','case ','break;'];
var redWords = ['int ','char ','void ','setup ','pinMode','for ','loop;',
'digitalWrite','digitalRead','delay','byte ','const ']
var blueWords = ['HIGH','LOW','OUTPUT'];
var re, word, replacement;
for (var i=0; i<redWords.length; i++) {
word = redWords[i];
replacement = '<span class="thewordRed">' + word + '</span>';
re = new RegExp(word, 'g');
preText = preText.replace(re, replacement);
}
for (var i=0; i<blueWords.length; i++) {
word = blueWords[i];
replacement = '<span class="thewordBlue">' + word + '</span>';
re = new RegExp(word, 'g');
preText = preText.replace(re, replacement);
}
for (var i=0; i<logicWords.length; i++) {
word = logicWords[i];
replacement = '<span class="thewordLogic">' + word + '</span>';
re = new RegExp(word, 'g');
preText = preText.replace(re, replacement);
}
document.getElementById(IDS).innerHTML = preText;
}
highlightArduinoCode('preText');
highlightArduinoCode('postText');
</script>
</body>
</html>