Hello all

I am trying to get some JavaScript to work where I am passing an object as the function parameter. This part of the code works well. Now what I am trying to do is prevent other events from firing once this href is clicked. My situation is I have a table row that has an onlick event. Part of the data in the table row contains an href. If the user clicks this href, I do not want to table rows onclick event to fire.
In the past, if I included the few lines of code below, it would prevent other events from firing. I tried adding this code to a condition where I am dynamically building the onclick event for the href but it is not working. Both events fire but I only want the events from the Test1 and Test2 links to fire. I do not want the TR event that displays “Display Message” to alert the user.

Any feedback on what I am doing wrong here? Attached is an example.

Thank you in advance for your time.

Code:
<html>
<head>
    <title>Test</title>
    <script type="text/javascript">
	
	function objectX() {
		var foo = "";
		
		this.setFoo = function( newFoo ) {
			foo = newFoo; 
		};
   	
		this.getFoo = function() {
			return foo;
		};
	}

	function testObj() {
		var content = document.getElementById('content');
		content.innerHTML = '<table><tr onClick="javascript:displayMessage();"><td><a href="#" id="Test1">Test 1</a></td><td><a href="#" id="Test2">Test 2</a></td></tr></table>';
		
		for( var i = 1; i < 3; i++ ) {
			var obj = new objectX();
			obj.setFoo( "Test " + i );

			// pass obj as an argument and receive it as a parameter
			// in order to keep a private reference to its current value
			document.getElementById("Test" + i).onclick = createTestClickHandler( "href", obj );
		}
	}
	
	function createTestClickHandler( event, obj ) {
		return function () {
			//-- Cross browser way to get event
			var evt = event || window.event;
			//-- Causes events to buggle up, a href goes first
			evt.stopPropagation ? evt.stopPropagation() : evt.cancelBubble = true;
			//-- Prevents other events from firing
			evt.preventDefault ? evt.preventDefault() : evt.returnValue = false;
			
			alert( "event: " + evt );
			
			testPassObj(obj);
		};
	}
	
	function testPassObj( obj ) {
		alert( "object: " + obj.getFoo() ); 
	}
	
	function displayMessage() {
		alert( "Display Message" );
	}
    
    </script>
</head>
<body onLoad="testObj();">
	<div id="content"></div>
</body>
</html>