How can I inject a link banner image in an hayden template with jquery?

Question

One of my clients has a site on squarespace using the hayden template. They have a banner image (thumbnail) on the home page with text and a button link over the top. The button links to a contact page but I'm trying to also get the ENTIRE background image to link to an external URL.

I do not have access to the HTML, I can only add custom CSS. And there's a thing called PAGE HEADER CODE INJECTION (Enter the code that will be injected onto the header for this page.)

I've been trying to inject jquery into the advanced editor but I think I might be using the wrong ids or classes?

Here's what I've been trying. Is there anyway for me to link this image without touching the HTML?

Site url: www.ironathleteclinics.com

I'm injecting this into the header:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

And this into the footer:

<script> $(document).ready(function(){ $('#collection-55dc8e2fe4b00187e448da91 .content-fill').css('cursor', 'pointer'); }); </script>

<script>$(function(){ $('#collection-55dc8e2fe4b00187e448da91 .content-fill').bind('click',function() { window.location = "www.google.com" }); });</script>

Answer 1

I actually just now figured it out in my particular case on the hayden template! Header:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

Footer:

$('#promotedGalleryWrapper, .promoted-gallery-wrapper, .banner-thumbnail-wrapper, .sqs-featured-posts-gallery').css('cursor', 'pointer'); }); </script>

<script>
   $(function(){ 
      $('#promotedGalleryWrapper, .promoted-gallery-wrapper, .banner-thumbnail-wrapper, .sqs-featured-posts-gallery')
      .bind('click',function() { 
                        window.location = "http://www.athleteps.com/nike-weightlifting/" 
           }); 
      });
 </script>