I tried to use jQuery to make a click on a specific element trigger another click on another element,
that was my code:
jQuery( ".menu-item menu-item-type-custom menu-item-object-custom
menu-item-37" ).click(function() {
jQuery(
".elementor-tab-title-2261" ).click(); });
You're logic appears to be correct, I'm assuming the class selectors you're using are not targeting the right elements, jQuery isn't being initialized, or there is an error earlier in the code that prevents this part of the code from running.
Check out this working code I wrote and compare it to what you have:
$('#btn2').on('click', function() {
console.log('btn 2 clicked!');
});
$('#btn1').click(function() {
$('#btn2').click();
});.button {
padding: 16px;
margin: 5px;
background-color: lightgrey;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="btn1" class="button">
<p>
Button one
</p>
</div>
<div id="btn2" class="button">
<p>
Button two
</p>
</div>In javascript, it can be achieved through dispatchEvent
const btn1 = document.querySelector('#btn1');
const btn2 = document.querySelector('#btn2');
const event = new Event('click');
btn1.addEventListener('click', function(e) {
e.preventDefault();
console.log('Button 1 clicked');
btn2.dispatchEvent(event);
});
btn2.addEventListener('click', function(e) {
e.preventDefault();
console.log('Button 2 clicked');
});<button id="btn1">Button 1</button>
<button id="btn2">Button 2</button>jQuery
$('#btn1').on('click', function(e) {
e.preventDefault();
console.log('Button 1 clicked');
$('#btn2').click();
});
$('#btn2').on('click', function(e) {
e.preventDefault();
console.log('Button 2 clicked');
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btn1">Button 1</button>
<button id="btn2">Button 2</button>Here is a more generalized way to do that not trigger only a click.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
function myFunction(){
$(".b").trigger("click");
}
$(".a").click(function(){
$(".a").hide();
myFunction();
});
$(".b").click(function(){
$(".b").hide();
});
});
</script>
</head>
<body>
<p class="a">Click me away!</p>
<p class="b">Click me too!</p>
</body>
</html>
