How to make this javascript text effect work?

Yesterday I was looking for a text effect using javascript. I was pointed to this fiddle: http://jsfiddle.net/vCx6W/1/ and this is where it was posted: https://stackoverflow.com/questions/4074399/what-to-choose-for-typewriter-effect-in-javascript

I am trying to use the same thing. I added the javascript like this:

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

 <script type="text/javascript">
 $.fn.teletype = function(opts) {
 var $this = this,
    defaults = {
        animDelay: 50
    },
    settings = $.extend(defaults, opts);

 $.each(settings.text, function(i, letter) {
    setTimeout(function() {
        $this.html($this.html() + letter);
    }, settings.animDelay * i);
 });
 };

 $(function() {
 $('#container').teletype({
    animDelay: 100,
    text: 'Now is the time for all good men to come to the aid of their country...'
 });
 });
 </script>

And this in the HTML:

 <div id="container"></div>

However, I am unable to make the text appear at all. What am I doing wrong?

Solution

Perhaps use the correct jQuery framework?

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

Also remove the breakline after http://code.jquery.com/... ;)

Like this:

<html>
    <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

     <script type="text/javascript">
     $.fn.teletype = function(opts) {
     var $this = this,
        defaults = {
            animDelay: 50
        },
        settings = $.extend(defaults, opts);

     $.each(settings.text, function(i, letter) {
        setTimeout(function() {
            $this.html($this.html() + letter);
        }, settings.animDelay * i);
     });
     };

     $(function() {
     $('#container').teletype({
        animDelay: 100,
        text: 'Now is the time for all good men to come to the aid of their country...'
     });
     });
     </script>

    </head>
    <body>

       <div id="container"></div>
    </body>
</html>