0

I am currently working on a custom WordPress-Plugin in which I need to extend the menu of the Elementor-plugin (the menu on the left when you edit a page or post via Elementor). For some reason I am able to access the HTML-elements of the Elementor-area in jQuery through a jQuery-function. When I define a variable for the element with the id #elementor-editor-wrapper I get a message in the console, that the element doesn't exist. When I type the command in the console directly, I can use the said element without any issues. Does anybody have any idea how to access the Elementor-elements through jQuery? Any help would be appreciated.

2
  • Have you checked that your jQuery code isn't running before elementor has finished loading? try putting your jQuery code in a document ready function Commented Apr 13, 2023 at 11:55
  • @JaimeePage thank you for your input. I have tried that previously and it still wont work. Commented Apr 14, 2023 at 19:36

1 Answer 1

0

Make sure that you have jQuery properly enqueued on your website. You can do this by adding the following code to your functions.php file:

function my_custom_scripts() {
    wp_enqueue_script( 'jquery' );
}
add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );

Next, you can use the jQuery ready() method to wait for the page to load before accessing the navigation elements.

jQuery( document ).ready(function( $ ) {
    // Your code here
});

To access the Elementor navigation elements, you can use jQuery selectors. For example, if you want to select the main navigation menu, you can use the following code:

var $menu = $( '#site-navigation' );

This code selects the element with the ID site-navigation.

Once you have selected the navigation element, you can use jQuery methods to manipulate it. For example, if you want to add a class to the navigation element, you can use the following code:

$menu.addClass( 'my-custom-class' );

This code adds the class my-custom-class to the navigation element.

In general, the process of accessing Elementor navigation elements through jQuery is analogous to that of accessing any other element on your website. The only thing you need to do is to apply the correct jQuery selectors and methods to handle the elements.

1
  • SHEESHRAM thank you for your input. I have tried all those things and it still wont work. The jQuery code works just fine on other elements on the page. It is only the elements of the Elementor-navigation that don't work at all (not even with regular JavaScript). It almost seems like that those elements are somehow blocked. Do you have any idea why that might be? Thanks in advance. Commented Apr 14, 2023 at 19:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.