CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Josh J
Josh J

Reputation: 71

Show/Hide on click with Javascript not working

I'm trying to use a basic on click to expand so when the user clicks on the title it shows more details but for some reason it isn't working.

Here is the page in question: http://eftposnz.wpengine.com/integrated-eftpos/pos-vendors/

I'm not sure if the issue is with the code itself or if I'm not using it correctly.

Here is the code I'm using:

$(document).ready(function () {
    $(".content").hide();
    $(".show_hide").on("click", function () {
        var txt = $(".content").is(':visible') ? 'Read More' : 'Read Less';
        $(".show_hide").text(txt);
        $(this).next('.content').slideToggle(50);
      show_hide.preventDefault();
    });
});

Any help would be greatly appreciated and please let me know if you need any further information.

Upvotes: 0

Views: 66

Answers (3)

Kim Hogeling
Kim Hogeling

Reputation: 661

Your jQuery is known in the window's scope as jQuery instead of $, which is a result of jQuery.noConflict(). Now you could create $ yourself by writing this above your code:

var $ = jQuery; // yuck!

But that would pollute your global scope!!

It would be cleaner to wrap your code into an anonymous function like this:

(function ($) {
  // your code
}(jQuery));

Upvotes: 1

Cristino
Cristino

Reputation: 311

The site is currently using wordpress, so there is not "$" defined in the window context, instead of this, is only avalible via "jQuery".

A solution can be:

(function($){

$(function(){
   /* Here your code */
});

})(jQuery);

Upvotes: 1

Jeto
Jeto

Reputation: 14927

I'm not familiar with WordPress, but it seems like the jQuery version it's using (or that you chose to use) won't let you use $ from the get-go.

As you can see on the jQuery version included on your page, jQuery.noConflict() is called at the end, making $ unavailable.

Here's what you can do, as an easy/safe workaround:

(function($) {

  // your code using $ here

})(jQuery);

Upvotes: 2

Related Questions