CODEWITHSUNDEEP
jqueryjquery-ui
Dave B
Dave B

Reputation: 31

jQuery UI .switchClass --- "undefined is not a function"

I'm adding some jQuery UI to a page. The code seems to be loaded, but when I call a function (switchClass) in the way specified in the docs, I get "Uncaught TypeError: undefined is not a function" in my Chrome console. Just before this, I am confirming that the source code (latest version, just downloaded) is loaded, and the alert fires successfully. I have researched the problem, but no other question has provided a solution. Anyone see what I'm doing wrong here?

<head>
  <script src="js/jquery-1.11.1.min.js"></script>
  <script src="js/jquery-ui.js"></script>

  <style>
          .red { color:#FF0000; }
          .green { color:#0000FF; }
  </style>

  <script>
          $(function() {

            if($.ui && $.ui.version){
                    alert("Jquery UI loaded");
                }

            $( "#button" ).click(function(){
              $( ".red" ).switchClass( "red", "green", 1000 );
              $( ".green" ).switchClass( "green", "red", 1000 );
            });

          });
  </script>

</head>
<body>

    <h3 class="red">TARGET TEXT</h3>
    <button id="button">Run Effect</button>

</body></code>

//EDIT: the /code tag above was added in writing this post. It's not part of the problem.

Upvotes: 1

Views: 3009

Answers (1)

john Smith
john Smith

Reputation: 17906

your code is working awesome, check this fiddle

http://jsfiddle.net/e5o91c6g/

i guess your js-files are wrong, or you messed up with that closing </code>tag wich may cause misinterpreting, to be sure

just try these libs: 

  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>

Upvotes: 3

Related Questions