Your issue is that you have $ on the parameters of the click event handler. That variable passed in is the Event generated, not jQuery. There are a few ways to fix this.
I̶n̶ ̶y̶o̶u̶r̶ ̶H̶T̶M̶L̶,̶ ̶y̶o̶u̶ ̶d̶o̶n̶’̶t̶ ̶h̶a̶v̶e̶ ̶a̶n̶ ̶e̶l̶e̶m̶e̶n̶t̶ ̶w̶i̶t̶h̶ ̶t̶h̶e̶ ̶c̶l̶a̶s̶s̶ ̶̶m̶y̶B̶o̶x̶̶.̶ (this was fixed in an edit)
A couple of points though, do you really need jQuery for this? It seems like using a hammer to kill a fly. Usually for “entirely clickable elements”, you can use a relative positioned parent, absolute positioned link, and set it to the top/left and 100% width and height.
<a href="#"><p class="myBox">This whole box should link.</p>
If you DO need jQuery for some reason, you can handle all of your jQuery functions in a single ready function, and pass the click event handler to it. (Note, you should also handle the situation where a link is NOT present, otherwise you’ll send users to a blank/broken URL if its clicked on):
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="myBox">
<p>This is test.<a href="https://example.com/">This is a link</a></p>
</div>
<div class="myBox">
<p>This is with no link</p>
</div>
Problem :
I have a wordpress installation and am trying to create a function that makes an entire div clickable based on the href within it. I’ve found a lot of documentation that tells me to do this.
then it does work and the div will redirect to google.com, so it doesn’t seem to be a problem with the way I’m implementing the script. Am I going wrong with the first method somewhere? Here’s my HTML
<div class="myBox">
<p><a href="http://www.example.com/notworking">This whole box should link but doesn't.</a></p>
</div>
Comments
Comment posted by Taplar
You’re issue is that you are passing
Comment posted by api.jquery.com/click
Could I ask why you don’t put the div inside the anchor tag? Isn’t this an option? if it is, you’d save yourself the functions etc. Could I also ask whether you actually have a function named $ which is firing everytime you click on it?
Comment posted by Taplar
@ItrysohardbutIcryharder There isn’t a function named
Comment posted by I try so hard but I cry harder
@Taplar I already assumed such thing, but I would rather ask for clarification, instead of jumping to conclusions.
Comment posted by Taplar
Given that they have
Comment posted by Teague
That’s it, I hadn’t clocked having to change the event handler an additional time in the second line. Thank you!