title: Uncaught TypeError: undefined is not a function
body: <p>I am following the example from <a href="http://www.geekbeing.com/2012/05/18/implement-live-web-chat-part-1" rel="nofollow">this site</a> to try and implement a live web chat application. I am very new to javascript to jquery, so I thought I'd just copy the example and learn as I go and add things.</p>
  
  <p>This is the code that I am using:</p>
  
  <pre><code>@{
      ViewBag.Title = "OnlineUsers";
  }
  
  
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Online Users&lt;/title&gt;
      &lt;link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css" /&gt;
      &lt;script src="http://cdn.leafletjs.com/leaflet-0.4/leaflet.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="wrapper"&gt;
          &lt;div id="upperPanel"&gt;
              &lt;div&gt;
                  &lt;ul id="messages" itemid="@HttpContext.Current.User.Identity.Name"&gt;
  
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div id="friends"&gt;
  
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div id="bottomPanel"&gt;
              &lt;textarea rows="2" cols="100" id="chatMessage"&gt;&lt;/textarea&gt;
              &lt;input id="chatSubmitMessage" type="submit" value="Send" style="margin-left: 10px;" /&gt;&lt;br /&gt;  
          &lt;/div&gt;
      &lt;/div&gt;​​​​​​​​​​​​​
  
      &lt;script type="text/javascript"&gt;
          $(function () {
              var pusher = new window.Pusher('0b7eeff567653e170094');
              var channel = pusher.subscribe('chat_channel');
              channel.bind('message_received', function (data) {
                  $("#messages").
                  append('&lt;li&gt;' + data.user + ' ' + data.message + ' ' + data.timestamp + '&lt;/li&gt;');
              });
  
              $('#chatSubmitMessage').bind('click', function () {
                  $.post("/", {
                      chatMessage: $('#chatMessage').val(),
                      username: $('#messages').attr('itemid')
                  });
              });
          });
      &lt;/script&gt;
  
      &lt;/div&gt;    
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This code gives me the following error in the Chrome debugger:</p>
  
  <pre><code>Uncaught TypeError: undefined is not a function
  (anonymous function)
  fire jquery-1.8.2.js:974
  self.add jquery-1.8.2.js:1018
  jQuery.fn.jQuery.ready jquery-1.8.2.js:246
  jQuery.fn.jQuery.init jquery-1.8.2.js:174
  jQuery jquery-1.8.2.js:44
  (anonymous function)
  (anonymous function) jquery-1.8.2.js:564
  jQuery.extend.globalEval jquery-1.8.2.js:565
  (anonymous function) jquery-1.8.2.js:6006
  jQuery.extend.each jquery-1.8.2.js:611
  jQuery.fn.extend.domManip jquery-1.8.2.js:5991
  jQuery.fn.extend.append jquery-1.8.2.js:5764
  jQuery.fn.(anonymous function) jquery-1.8.2.js:6186
  $.ajax.success jquery.mobile-1.2.0.js:3685
  fire jquery-1.8.2.js:974
  self.fireWith jquery-1.8.2.js:1082
  done jquery-1.8.2.js:7788
  callback
  </code></pre>
  
  <p>I'm assuming the error has something to do with the function being unnamed, any help will be greatly appreciated.</p>