jQuery - MooTools Conflict

JavaScript
1

Hi!

RESOLVED - SEE POST BELOW

I’m trying to do a basic web page which uses both jQuery and MooTools.

WORKING DEMO: http://jsfiddle.net/DddQA/

However, anytime I try to reference MooTools, it stops the red block being a hyperlink.

Here is my current code that I am having issues with:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"> 

        <head>

        <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1rc1.min.js"></script>    
        <script type="text/javascript">

        <!-- remove this line below to make the hyperlink box work correctly -->
        jQuery.noConflict();

        //<![CDATA[ 
        $(window).load(function(){
        $(".affiliate-scheme").click(function(){
             window.location=$(this).find("a").attr("href");
             return false;
        });
        });//]]>
        </script>

        <!-- remove this line below to make the hyperlink box work correctly -->
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.4.5/mootools-yui-compressed.js"></script>

        </head>

        <body id="affiliate-scheme">

            <div class="affiliate-scheme" style="background:red"> 
                 <h3>Affiliate Scheme</h3> 
                 <ul> 
                    <li><a href="/affiliate-scheme/" title="Promote with our Affiliate Scheme">Promote Us</a></li> 
                 </ul> 
            </div> 

        </body>

    </html>

Can someone show me how I can fix this so it will allow MooTools AND jQuery on the same page?

Many thanks!!

2

RESOLVED!


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">

    <head>
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1rc1.min.js"></script>    
    <script type="text/javascript">  
    var $j = jQuery.noConflict();      
    //<![CDATA[
    $j(window).load(function(){
    $j(".affiliate-scheme").click(function(){
         window.location=$j(this).find("a").attr("href");
         return false;
    });
    });//]]>
    </script>        
       
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.4.5/mootools-yui-compressed.js"></script>
    
    </head>
    
    <body id="affiliate-scheme">
    
        <div class="affiliate-scheme" style="background:red">
             <h3>Affiliate Scheme</h3>
             <ul>
                <li><a href="/affiliate-scheme/" title="Promote with our Affiliate Scheme">Promote Us</a></li>
             </ul>
        </div>
        
    </body>
    
</html>