From TomatoCart Wiki

TomatoCart uses mootools to develop javascript rich featured application by default. But many users want to use JQuery as JQuery offer a large number of plugins. Since MooTools is prototype-based and jQuery is not, jQuery and MooTools may be used together on the same page. This tutorial use jqFancyTransitions slideshow plugin to illustreate how to use jQuery plugin in TomatoCart.
In this tutorial we will use the JQuery jqFancyTransitions and Mootools noobslide to display two slideshow in the home at the same time as the picture blow.

Step1: Include the JQuery and jqFancyTransitions library
Create folder jquery and jqFancyTransitions in the "/ext" folder; copy the jquery-1.4.2.min.js to jquery folder and jqFancyTransitions.1.8.min.js to jqFancyTransitions folder. Include the javascript file in the templates/glass_gray/index.php file after the other js library. For example:

<script type="text/javascript" src="ext/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="ext/jqFancyTransitions/jqFancyTransitions.1.8.min.js"></script>

Step 2: Use jQuery.noConflict() to solve conflicting
jQuery is namespaced so the $ function is free for MooTools to use. The $ function can be overrided by calling the jQuery.noConflict() function after the jQuery and the other library. This code revert $ back to its original library namely mootools and you can still use "jQuery" in the rest of your application. For example:

<script type="text/javascript" src="ext/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="ext/jqFancyTransitions/jqFancyTransitions.1.8.min.js"></script>
<script type="text/javascript">
  jQuery.noConflict();
</script>

Step3: Create the html code with some images for the slideshow.

  <div id="ft" style="margin: auto">
    <img src="images/dell_xps630_en.png" />
    <img src="images/dell_xps630_en.png" />
    <img src="images/thinkcentre_m57p_en.png" />
    <img src="images/apple_iphone_3g_en.png" />
  </div>

Step 4: Invoke the jqFancyTransitions to create the image gallery.

<script>
  jQuery('#ft').jqFancyTransitions({links : true, width: 960,height: 210 });
</script>

If you still want to use $ you can use following code. The code passes jQuery to itself and then we call the argument $, thus jQuery is contained, so to speak. For more details please to go http://docs.jquery.com/Using_jQuery_with_Other_Libraries.

<script>
  (function($) {
    $('#ft').jqFancyTransitions({links : true, width: 960,height: 210 });
  })(jQuery);
</script>