title: Check if an image exists in an Anchor tag before adding one
body: <p>just wondering if you could help me on this one,
  I have anchor tags for PDF docs on a page. Some have a pdf icon associated</p>
  
  <pre><code>&lt;li&gt;
     &lt;a class="pdf" href="/link_to_pdf_1.pdf" target="_blank"&gt; Title of PDF 1
       &lt;img alt="Adobe PDF document" src="/link_to_pdf_icon/pdf-icon.png"&gt;
     &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>Some do not.</p>
  
  <pre><code>&lt;li&gt;
    &lt;a class="pdf" href="/link_to_pdf_2.pdf" target="_blank"&gt;Title of PDF 2 &lt;/a&gt;
  &lt;/li&gt;
  </code></pre>
  
  <p>I have some jQuery code that appends a pdf icon for links that have a class .pdf </p>
  
  <p><code>$('a.pdf').append('&lt;img src="/link_to_pdf_icon/pdf-icon.png" alt="Adobe PDF document"/&gt;');</code></p>
  
  <p>This is adding a second icon for the first link. How should check if an image already exists before adding another one.</p>