Question

I’m working on a personal project and I’m having a small issue:

This is my code code and currently works: http://jsfiddle.net/gvM3b/:

$(".show-more").click(function () {
    $(this).text("(Show Less)");
$(".text").toggleClass("show-more-height");
});​

The issue is that the “(Show More)” text changes to “(Show Less)” but not switches back when needed.

^That’s one thing, an additional thing would be if you know how to add the […] when it says show more but on the text. Been trying to figure it out but had to ask for a little of help, I’m new to jquery.

Thanks!

Answer 1

Update your jQuery:

$(".show-more").click(function () {
    if($(".text").hasClass("show-more-height")) {
        $(this).text("(Show Less)");
    } else {
        $(this).text("(Show More)");
    }

    $(".text").toggleClass("show-more-height");
});

See http://jsfiddle.net/gvM3b/1/