jQuery: TypeError 'undefined'is not a function

Question

I'm just starting out with jQuery and I'm stuck on a basic example. I'm using Safari for this example.

01.js:

$(document).ready(function() {

    $('div.poem-stanza').addclass('highlight');

});

first.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Through the Looking-Glass</title>
<link rel="stylesheet" href="script/01.css">
<script language="javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script language="javascript" src="01.js"></script>
</head>
    <h1>Through the looking-Glass</h1>
    <div class="author">by Lewis Caroll</div>
    <div class="chapter" id="chapter-1">
        <h2><class="chapter-title">1. Looking-Glass House</h2>
        <p>There was a book lying near Alice on the table, and while she sat watching the White Kind (for she was still a little anxious about him, in case he fainted again), she turned over the leaves, to find some part that she could read, <span class="spoken">"&mdash;for it's all in some language I don't know,"</span> she said to herself.</p>
        <p>It was like this.</p>
        <div class="poem">
            <h3><class="poem-title">YKCOWREBBAJ</h3>
            <div class="poem-stanza">
                <div>Sevot yhtils eht dna ,gillirb sawT'</div>
                <div>;ebaw eht ni elbmig dna eryg diD</div>
                <div>, sevogorob eht erew ysmim llA</div>
                <div>.ebargtuo shtar emom eht dnA</div>
            </div>
        </div>
        <p>She puzzled over this for some time, but at last a bright thought struck her. <span class="spoken">"Why, it's a looking-glass book, of course! And if I hold it up against a glass, the words will al go the right way again."</span></p>
        <p>This as the poem that Alice read.</p>
        <div class="poem">
            <h3 class="poem-title">JABBERWOCKY</h3>
              <div class="poem-stanza">
                    <div>'Twas brillig, and the slithy toves</div>
                    <div>Did gyre and gimble in the wabe;</div>
                    <div>All mimsy were the borogoves,</div>
                    <div>And the mome raths outgrabe.</div>
                </div>  
            </div>
        </div>
<body>
</body>
</html>

In the Safari webdevelopment kit, I get the error "jQuery: TypeError 'undefined'is not a function" returned on .addclass('highlight'), and it seems to fail to run the .js I requested.

Can somebody enlighten me on what I'm doing wrong here! Thanks for the help!

Javascript is case-sensitive, `addclass` is different than `addClass`. — , Nov 08 '13 at 10:59
try to use a better editor as I don't no which one you're using I advise to use WebStorm from jetbrains. good luck — Abderrazak BOUADMA, Nov 08 '13 at 10:59
@wared Thanks I changed that, didn't actually know that JS was case-sensitive.. So much to learn ;). Changed it, but it didn't gave me any results though. — HansR83, Nov 08 '13 at 11:09
@Abderrazakk, I'm actually using TextMate as a editor, but I will look into WebStorm, thanks! — HansR83, Nov 08 '13 at 11:09
@jumpingcode no but using an editor with code completion for a person starting with new technology, in my opinion, is something which'll help more ! don't you ! — Abderrazak BOUADMA, Nov 08 '13 at 11:11
Do you still get the error "jQuery: TypeError 'undefined'is not a function"? — , Nov 08 '13 at 11:13
Thanks guys, actually used AddClass at first, and addClass afterwards. The last one worked.. Thanks for the fast responses! Loving this site :) — HansR83, Nov 08 '13 at 11:13

score 2 · Accepted Answer · answered Nov 08 '13 at 10:57

2

addclass() should be addClass()

answered Nov 08 '13 at 10:57

Anto Jurković

11,188
2
29
42

score 1 · Answer 2 · edited May 23 '17 at 10:24

1

You need to use addClass('highlight') not addclass('highlight'), notice it's camel case and not lower case.

Furthermore, I believe that this isn't the primary reason for your error and it may be that in your script you have to replace $ with jQuery:

jQuery(document).ready(function() {

    jQuery('div.poem-stanza').addClass('highlight');

});

Reference

edited May 23 '17 at 10:24

Community

1
1

answered Nov 08 '13 at 10:56

ediblecode

11,701
19
68
116

While you're correct, I don't think that is the bigger issue as you would get `unrecognised function 'addclass'` – Rory McCrossan Nov 08 '13 at 10:58
Or may be **`Object [object Object] has no method 'addclass'`** – palaѕн Nov 08 '13 at 10:59
@RoryMcCrossan I know. I'm adding to my answer currently for other checks. That part is just the first part I noticed incorrect. – ediblecode Nov 08 '13 at 10:59
@palaѕн yeah that too :D – Rory McCrossan Nov 08 '13 at 11:00

score 0 · Answer 3 · answered Nov 08 '13 at 10:58

0

Try this

$(document).ready(function() {

    $('div.poem-stanza').addClass('highlight');

});

answered Nov 08 '13 at 10:58

Sridhar R

20,190
6
38
35

jQuery: TypeError 'undefined'is not a function

3 Answers3