How to fix Jquery Conflicts in Joomla (Chrome & Safari)

After digging through some more forum posts, I found the answer.

Change the line:

Code:

$(function() {

to:

Code:

jQuery.noConflict();
jQuery(function($) {

noConflict removes the alias from jQuery to $. You could replace all of your $'s with jQuery if you really wanted. Or, just wrap your code with jQuery(function($) { regular jQuery code });

Similarly, the 

Code:

$(document).ready(function(){ regular jQuery code });

can be replaced with 

Code:

jQuery(document).ready(function($) { regular jQuery code });

Example like:

<script src="<?php echo $this->baseurl ?>/templates/had2b/js/jquery-1.7.1.js"></script>

<script type="text/javascript">
$(function(){
    $('h1.new-register').click(function(){
        $('div.register').slideToggle();
    });
});
</script>

                      change to

<script src="<?php echo $this->baseurl ?>/templates/had2b/js/jquery-1.7.1.js"></script>

<script type="text/javascript">jQuery.noConflict();</script>

<script type="text/javascript">
jQuery(function($){
    $('h1.new-register').click(function(){
        $('div.register').slideToggle();
    });
});
</script>