JavaScript - Need Help! Color Coding Columns.

function into(whoseCalling)
		{
		    document.getElementById(whoseCalling).style.borderStyle = "double";
			document.getElementById(whoseCalling).style.borderTopColor = "blue";
			document.getElementById(whoseCalling).style.borderBottomColor = "red";
			document.getElementById(whoseCalling).style.borderLeftColor = "yellow";
			document.getElementById(whoseCalling).style.borderRightColor = "green";
			document.getElementById(whoseCalling).style.borderWidth = "8px";
		
		for (i=0; i<30; i++)
		{
		  document.getElementById("img" +i).style.opacity = ".5";
		}
		    }

			<div id="content">
				<div id="control">
					<div id="prev" style="cursor:pointer" onclick="changeComic()">
						<h5>previous</h5>
					</div>
					<div id="next" style="cursor:pointer" onclick="comicChange()">
						<h5>next</h5>
					</div>
				</div>
				<img id="comic" src="/images/comics/page005.png" alt="there is no alt">
			</div>

<script type="text/javascript">
function Msg1(){
  document.getElementById('myText').innerHTML = '<script src="page1.js" type="text/javascript"></script>';
}
function Msg2(){
  document.getElementById('myText').innerHTML = '<script src="page2.js" type="text/javascript"></script>';
}
</script>
<input type="button" onclick="Msg1()" value="Show Message 1" />
<input type="button"  onclick="Msg2()" value="Show Message 2" />
<p id="myText"></p>

function calculate_paid(v)
{
 var rentdue = document.getElementById("rentdue");
 var prevbal = document.getElementById("prevbal");
 var misc = document.getElementById("misc");
 var late = document.getElementById("late");
 var amtpaid = document.getElementById("amtpaid");
 var tentpay = document.getElementById("tentpay");
 var hudpay = document.getElementById("hudpay");
 var datepaid = document.getElementById("datepaid");
 var late = document.getElementById("late");
 var dateNow = new Date();
 var dayNow = dateNow.getDate();
 var datePaid = (dateNow.getMonth()+1)+"/"+dateNow.getDate()+"/"+dateNow.getFullYear();
 switch(v)
 {
  case amtpaid:
   var tpay = amtpaid.value - hudpay.value;
   if(tpay >= 0){tentpay.value = tpay;}
   if(amtpaid.value > 0){datepaid.value = datePaid;}
   break;
  case tentpay:
   if(!hudpay.value || hudpay.value == " "){hudpay.value = 0;}
   if(!tentpay.value || tentpay.value == " "){tentpay.value = 0;tentpay.select();}
   amtpaid.value = parseInt(tentpay.value) + parseInt(hudpay.value);
   if(tentpay.value > 0){datepaid.value = datePaid;}
   break;
  case hudpay:
   if(!tentpay.value || tentpay.value == " "){tentpay.value = 0;}
   if(!hudpay.value || hudpay.value == " "){hudpay.value = 0;hudpay.select();}
   amtpaid.value = parseInt(tentpay.value) + parseInt(hudpay.value);
   if(hudpay.value > 0){datepaid.value = datePaid;}
   break;
//*
  case prevbal:
  var balance = parseInt(rentdue.value) + parseInt(prevbal.value) + parseInt(misc.value) - parseInt(hudpay.value);
  if(amtpaid.value < balance.value){
  prevbal.value = parseInt(balance.value) - parseInt(amtpaid.value);}
  if(dayNow.value > 5){late.value = "L";
   prevbal.value = prevbal.value + 10;}
  break;
  } 
     }

Portal.prototype = {

	initialize : function (settings, options, data) {

		// set options
		this.setOptions(options);
		
		// set blocks to their positions
		this.apply_settings(settings);
		
		// load data to blocks
		//this.loadData(data);
						
		// if editor is enabled we proceed
		if (!this.options.editorEnabled) return;
		
		// get all available columns
		var columns = $(this.options.portal).getElementsByClassName(this.options.column);
		
		// loop through columns array
		$A(columns).each(function(column) {
			
			// create sortable
			Sortable.create(column, {
				containment : $A(columns),
				constraint  : this.options.constraint,
				ghosting	: this.options.ghosting,
				tag 		: this.options.tag,
				only 		: this.options.block,
				dropOnEmpty : this.options.droponempty,
				handle 		: this.options.handle,
				hoverclass 	: this.options.hoverclass,
				scroll		: this.options.scroll,
				onUpdate 	: function (container) {
					
					// if we dont have a save url we dont update
					if (!this.options.saveurl) return;
					
					// if we are in the same container we do nothing
				    if (container.id == this.options.blocklist) return;
					
					// get blocks in this container
					var blocks = container.getElementsByClassName(this.options.block);
					
					// serialize all blocks in this container
					var postBody = container.id + ':';
					postBody += $A(blocks).pluck('id').join(',');
					postBody = 'value=' + escape(postBody);
					
					// save it to the database
					new Ajax.Request(this.options.saveurl, { method: 'post', postBody: postBody, onComplete : function (t) {
						$('data').update(t.responseText + $('data').innerHTML);
					} });
										
				}.bind(this)
			});
			
		}.bind(this));
	},
	
	apply_settings : function (settings) {
		// apply settings to the array
		for (var container in settings) {
			settings[container].each(function (block) { if (!$(container)) { console.log('Block '+container+' not found') } else { $(container).appendChild($(block)); }  });
		}
	},
	
	setOptions : function (options) {
		// set options
		this.options = {
			tag				: 'div',
			editorEnabled 	: false,
			portal			: 'portal',
			column			: 'column',
			block			: 'block',
			blocks			: 'blocks',
			content			: 'content',
			configElement	: 'config',
			configSave		: 'save-button',
			configCancel	: 'cancel-button',
			configSaved		: 'config-saved',
			handle			: 'draghandle',
			hoverclass		: 'target',
			scroll			: window,
			remove			: 'option-remove',
			config			: 'option-edit',
			blocklist		: 'portal-column-block-list',
			saveurl			: true,
			constraint		: false,
			ghosting		: false,
			droponempty		: true
		}
		
		Object.extend(this.options, options || {});
	},

<div id="columns">
				
				<div id="column-1" class="column menu"></div>
				
				<div id="column-2" class="column blocks"></div>
				
				<div id="column-3" class="column sidebar"></div>
				
				<div class="portal-column" id="portal-column-block-list" style="display: none;">
                // example block
                <div class="block" id="block-1">
<h1 class="draghandle"><span id="title-1" class="editText">1977</span></h1>
<p><span id="evnt-1" class="editText">Berry Academy</span></p>
</div>
                    
				</div>
				
			</div>