title: How do I use JQuery to wrap a specific image (located in the header) in an anchor tag?
body: <p>I'm trying to use tag manager to inject jquery on a site in order to make an image in the header link to a specific page on the site. The code is working almost completely across the board, but not 100% (seems odd to me).</p>
  
  <p>The image:</p>
  
  <pre><code>&lt;img class="img-responsive margin-auto" src="/assets/misc/12345/image.png" alt="example" aria-label="example"&gt;
  </code></pre>
  
  <p>The JQuery:</p>
  
  <pre><code>&lt;script type="text/javascript" id="img-link"&gt;
      $(document).ready(function() {
          $("img[src*='image.png']").wrap("&lt;a href='example.com/image-related-page.html'&gt;&lt;/a&gt;");
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>The image is a direct child of a div for mobile screen sizes and a list item for desktop screens (dealing with website platform here, which is the reason for tag manager.) what am I doing wrong?</p>
  
  <p>Edit: the image is not clickable after the first visit to a certain page of the site (but works as expected on all other pages). unfortunately, due to me having to do this as a workaround the platform that this website is on, a minimal, complete, and verifiable example isn't really feasible.</p>