Why do wordpress Jquery only work after refresh-CodePudding

This is my code :

<script type="text/javascript">
  jQuery( document ).ready(function() {
    jQuery('#bookbtn_loc_1').on('click', function(event){
      jQuery("a.da-close").click();
      jQuery("#loc").val("B&B de fruithoeve Schalkhoven").change();
    });
  });
</script>

I want to run this code when the button with id #bookbtn_loc_1 is clicked.

But, this script only works after I refresh the page. During the first load, it will not work.

I have tried adding the code on the header and body, but the issue is still there.

I hope there is someone out there who has gone to this issue and solved it already. Please share your solution.

Thank you.

CodePudding user response：

Try with this:

<script type="text/javascript">
    jQuery( document ).ready(function() {
        jQuery( document ).on('click', '#bookbtn_loc_1', function(){
            jQuery("a.da-close").click();
            jQuery("#loc").val("B&B de fruithoeve Schalkhoven").change();
        });
    });
</script>

Remove event parameter from function if it's not needed.

CodePudding user response：

i found that there is no button with id "bookbtn_loc_1" exist in your page. So that the script can not bind the click event to the button, so it's not fire.

As you can see in the bellow image, when i find "bookbtn_loc_1" - there are no result: