Javascript – jQuery works in Firefox when Firebug is running, does not work when Firebug is NOT running

firebugfirefoxjavascriptjquery

I have the following Javascript libraries loaded for my page.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js"></script>
<script type="text/javascript" src="./js/jquery.scrollTo-min.js"></script>

I have the div element that I want to place them in:

<div class="content" id="content">
</div>

I have this link:

<a id="changeText" href="rules.html">Click to change</a>

Finally, I have the following jQuery code:

<script>

$(document).ready(function() {
 $("#changeText").click(function(){

  var url = $(this).attr("href");

  $("#content").load(url);

  console.log(url);

  $.scrollTo("0%", 400);
 });
});
</script>

This all works in Safari. The oddest part of the story is that it only works in Firefox when Firebug is on. When Firebug is NOT on, the page seems to be dynamically loaded, but then the page loads rules.html and switches to it, which is not my desired goal.

Also, of course, none of this works in IE8.

What am I doing wrong?

Best Solution

You'd better wrap all your

console.log(...) 

into

if (window.console) {
    console.log(...);
}