Currently using: Zen Cart v1.3.9h

I am working to create multiple EZ pages for my store. I want to use AJAX to display some of my information so that it will look more clean on my page.

using: latest Jquery + my custom JS file (/includes/templates/custom/jscript/)
also using custom CSS: (/includes/templates/best_biz/css/)
--- Both of my files load correctly and display when viewing the source of the EZ page.

This is the problem, I use a <DIV> to hide the information until a link is click to display it.. however, the javascript never initiates to display the div.

code: JS File
Code:
$(document).ready(function(){
a[@rel*=showDiv].click(function () {
    var divname= this.name;
    alert("click! div:" + div)
    // $("#"+divname).show(700)
    });
});;
code: EZ page
Code:
<a href="#" rel="showDiv" name="compareContainer">Show Container</a>

<div id="compareContainer" style="display: none">(lots of stuff here</div>
I made sure my DIV displays styled correctly by displaying it, but I can not get jQuery to display the div on click. (I have done this before outside of ZenCart and had it working)

Please, any help would be greatly appreciated! If I was not clear enough please ask me any questions you may have. Thanks!