Two instances on one page (conflict).

Two instances on one page (conflict).

Below is the related script within the HTML. I'm trying to include no conflict within the script but I can't get it to work. One instance always loses it's function. Any help is much appreciated.

<head>
<script src="respond.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="mootools.svn.js"></script>
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script src="js/modernizr.custom.js"></script>
</head>
<body leftmargin="0" topmargin="0">
<div id="top-panel">
  <div id="upperNav">
    <p>&nbsp;</p>
  </div>
</div>
<script type="text/javascript">
window.addEvent('domready', function(){
var mySlide = new Fx.Slide('top-panel').hide();
$('toggle').addEvent('click', function(e){
e = new Event(e);
mySlide.toggle();
e.stop();
});
});
</script>


content...

(THIS IS WHERE THE SECOND INSTANCE IS CALLED WITHIN THE BODY)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/grid.js"></script>
<script>
$(function() {
Grid.init();
});
</script>