Make sure to check the .hidden property display using .css and within the click event on the link.
e.preventDefault(); // prevent the default click behavior
if ($('.hidden').css('display') == 'block') {
// check if .hidden display is set to block
$('#urlx').unbind('click'); // Unbind the click event to remove the preventDefault()
In the given example, when .hidden has display:none, the click action doesn't work.
Change the display:none to display:block to enable the link to work properly.
$('#urlx').on("click", function(e){
e.preventDefault();
if ($('.hidden').css('display') == 'block') {
$('#urlx').unbind('click');
document.getElementById("urlx").click();
}
});
.hidden { display: none; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<div id="HIDDENDIV" class="hidden">this is a div</div>
<a href="https://www.google.com" id="urlx">Google go example!</a>
Updated!
Automatic click:
It will wait for 2 seconds before triggering the click!...
setTimeout(function(){
if ($('.hidden').css('display') == 'block') {
document.getElementById("urlx").click();
}
},2000);
.hidden { display: block; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<div id="HIDDENDIV" class="hidden">this is a div</div>
<a href="https://www.google.com" id="urlx">Google go example!</a>