How to detect linked PDF on a page and show message to download Adobe reader using jquery?

Question

If page has .pdf files linked then a message in <p> should be add just before end of the #mainontent div as a last paragraph <p>

for example this is default html?

<div id="maincontent">
<ul class="cheat_sheet_downloads">
<li><a href="http://www.addedbytes.com/download/css-cheat-sheet-v2.pdf"&gt;PDF, 316Kb</a></li>
<li><a href="http://www.addedbytes.com/download/css-cheat-sheet-v3.pdf/"&gt;PNG, 77Kb</a></li>
</ul>
<div>

After detecting pdf

it should be like this

<div id="maincontent">
    <ul class="cheat_sheet_downloads">
    <li><a href="http://www.addedbytes.com/download/css-cheat-sheet-v2.pdf/"&gt;PDF, 316Kb</a></li>
    <li><a href="http://www.addedbytes.com/download/css-cheat-sheet-v3.pdf/"&gt;PNG, 77Kb</a></li>
    </ul>
<div>

<div id="ttip">
Most computers will open PDF documents automatically, but you may need to 
download <a title="Link to Adobe website - opens in a new window"  
href="http://www.adobe.com/products/acrobat/readstep2.html" target="_blank">
                 Adobe Reader</a>.
</div>

or as another div after #maincontent div. Is it possible with jquery?

Edit:

Page can have one or more PDF i want to add message at bottom. and i need IE 6 compatibility too

Edit 2 : I can't and don't want to use mouse over tooltip

Answer 1

You can iterate through all the anchor tags and find the extension of this using jQuery.

But I don't think this will be enough for you. Some sites streams the files when a request is made to the server. You won't be able to determine what the server will download when such a request is made.

For example when I click on a button a request is made to the server and the server processes the request in the following manner.

Response.ContentType = "application/pdf";
Response.AppendHeader("Content-Disposition","attachment; filename=test.pdf");    
Response.TransmitFile("yourfilepath);
Response.Flush();

This will force the browser to open a dialog box to either save or open the document.

Answer 2

var tip = "<p>Most computers will open PDF documents ";
tip += "automatically, but you may";
tip += "need to download <a title='Link to Adobe website-opens in a new window'";
tip +=" href='http://www.adobe.com/products/acrobat/readstep2.html'  
               target='_blank'>Adobe Reader</a>.</p>";

$(document).ready(function(){

    //IF NUMBER OF PDF LINKS IS MORE THAN ZERO INSIDE DIV WITH ID maincontent
    //THEN THIS WILL PUT TIP PARAGRAPH AS LAST CHILD OF DIV
    if($("div#maincontent a[href*='/pdf']").length>0){
    $("div#maincontent").children(":last-child").after(tip);
    }
});

check it here