My first dig at jQuery
<p>I'm a complete newbie as far as jQuery is concerned. I also don't know much of JavaScript except for some very basic stuff.</p>

<p>I'm following this tutorial here: <a href="http://docs.jquery.com/How_jQuery_Works" rel="nofollow">http://docs.jquery.com/How_jQuery_Works</a></p>

<p>And nothing's working! :-)</p>

<p>I created a folder on my machine's hard drive here: C:\rnd\jQuery</p>

<p>Then, in that folder, I put the jquery.x.x.js file that I downloaded from the jQuery website and I created a test.html file and wrote the following code in it:</p>

<pre><code>&lt;!doctype html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;script type="text/javascript" src="jquery-1.4.2.js"&gt;&lt;/script&gt;

    &lt;style type="text/css"&gt;
      a.test { font-weight: bold; }
    &lt;/style&gt;

    &lt;script type="text/javascript"&gt;
      $.(document).ready(function() {
        $("a").addClass("test");
        $("a").click(function(event) {
          alert("Thanks for visiting.");
          event.preventDefault();
        });
      });
    &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;a href="http://jquery.com/"&gt;jQuery&lt;/a&gt;
  &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>It just does the normal behavior of taking me to the jQuery website. I ran it on Chrome, IE and Firefox. I have JavaScript enabled in the browsers. It's all the same everywhere. It doesn't do anything that I expected it to do. It just takes me to the website.</p>

<p>Except on IE, it shows me that message box saying an error occurred in your script. When I click "Yes" to debug, it opens up the debugger but it doesn't highlight any line of code so I don't really know what's happening.</p>

<p>Then, when I had the following line to my code:</p>

<pre><code>$("a").hide("slow");
</code></pre>

<p>And my complete code looks like this:</p>

<pre><code>&lt;!doctype html&gt;
&lt;html&gt;
  &lt;head&gt;
    &lt;script type="text/javascript" src="jquery-1.4.2.js"&gt;&lt;/script&gt;

    &lt;style type="text/css"&gt;
      a.test { font-weight: bold; }
    &lt;/style&gt;

    &lt;script type="text/javascript"&gt;
      $.(document).ready(function() {
        $("a").addClass("test");
        $("a").click(function(event) {
          alert("Thanks for visiting.");
          event.preventDefault();
          $("a").hide("slow");
        });
      });
    &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;a href="http://jquery.com/"&gt;jQuery&lt;/a&gt;
  &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>At this, nothing different happens in Firefox and Chrome, but in IE, it breaks again into the debugger, this time with this line highlighted in yellow, and it reports that the identifier <code>jQuery</code> is not defined.</p>

<pre><code>(function($) {
  $.fn.textDropShadow = function(){
    $(this).html('&lt;span class="jq-shadow"&gt;'+$(this).html()+'&lt;/span&gt;&lt;span&gt;'+$(this).html()+'&lt;/span&gt;');
    return $(this);
  }
})(jQuery);
</code></pre>

<p>And that, I believe is some JavaScript code on the jQuery website.</p>

<p>I feel completely lost. Any help would be appreciated.</p>

<p><strong>Update:</strong>
I have my complete HTML and it is valid XHTML. It's too bad the browser displays that as an HTML response stream and I can't even get it to show up here as a script. Damn! How do you make HTML show up here?</p>
