Elementor Question posted in
A comprehensive tutorial library can be found here.

How to change title when toggle is active in Elementor Page Builder

Not active:

<div id="elementor-tab-title-1971" class="elementor-tab-title" data-tab="1" role="tab" aria-controls="elementor-tab-content-1971" aria-expanded="false" tabindex="-1" aria-selected="false"><a href="" class="elementor-toggle-title">Lees meer</a></div>

Active:

<div id="elementor-tab-title-1971" class="elementor-tab-title elementor-active" data-tab="1" role="tab" aria-controls="elementor-tab-content-1971" aria-expanded="true" tabindex="0" aria-selected="true">
                                                <a href="" class="elementor-toggle-title">Read Less</a>
                    </div>

I want to change the title when the Toggle is active. How can I do this with jQuery?

I’m trying to do this with jQuery. but I couldn’t do it.

Tags:

2

Answers


  1. 0

    You can do it like this.

    jQuery(function($){
    
    /* To handle after page load*/
    if($(".elementor-tab-title").hasClass("elementor-active")){
        $(".elementor-tab-title").find("a.elementor-toggle-title").text("active text");
    }
    else{
        $(".elementor-tab-title").find("a.elementor-toggle-title").text("Inactive text");
    }

    /* To handle on element change*/
    $(".elementor-tab-title").on('change, click', function( e ){
        e.preventDefault();
        
        if($(this).hasClass("elementor-active")){
            $(this).find("a.elementor-toggle-title").text("active text");
        }
        else{
            $(this).find("a.elementor-toggle-title").text("Inactive text");
        }
    });
});
    Login or Signup to reply.
  2. 0

    The simple answer for the new researcher

    use another plugin for items creating issues.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search