CODEWITHSUNDEEP
jqueryhtml
George Reason
George Reason

Reputation: 173

jQuery change on click

Im trying to make the "Minus" sign turn back into the plus sign after the user has closed the expendable text.

Here is the code HTML

<p class="textDropTitle"><span class="textDropLogo"></span>Title</p>
    <div class="textDropSub"><p>This is my text Below</div>
    <p class="textDropTitle"><span class="textDropLogo">+</span>Title</p>
    <div class="textDropSub"><p>This is my text Below</div>
    <p class="textDropTitle"><span class="textDropLogo">+</span>Title</p>
    <div class="textDropSub"><p>This is my text Below</div>

jQuery

$(".textDropSub").hide();

$('.textDropLogo', this).text('+');

$(".textDropTitle").click(function() {
    $(this).next().toggle('fast');
    $('.textDropLogo', this).text('-');
});

Upvotes: 3

Views: 54

Answers (1)

Roko C. Buljan
Roko C. Buljan

Reputation: 206121

Quite simple using a Conditional Ternary Operator (?:)

$(".textDropTitle").click(function() {

    $(this).next().toggle('fast');

    var $el = $('.textDropLogo', this);
    $el.text( $el.text() == '+' ? '-' : '+' );

});

[condition] ? [if is true] : [if is false] ;

READ MORE

Upvotes: 2

Related Questions