I work on a portal website that has approximately 700 pages and several thousand links. Some of these links are to various documents (.doc, .pdf, .xls). I would like to use Jquery to dynamically find these links on a page when the pages load and add another link directly after it that can invoke a modal window. When the modal window opens I need to hold onto the values of the original link as it will be stored in a DB. So I think I will need the second link to contain the first links name and URL pattern as some sort of property that I can store. I am not sure the best way to accomplish this.
For example: The original links would look like: <a href="testlink.doc">Document</href> <a href="testlink2.pdf">PDF</href> <a href="www.something.com">WebSite</href> After the JS dynamically updates the link it would look like: <a href="testlink.doc">Document</href><a href="/modalwindow.html" property1="testlink.doc" property2="Document"><img src="button.jpg"/></ a> <a href="testlink2.pdf">PDFNAME</href><a href="/modalwindow.html" property1="testlink2.pdf" property2="PDFNAME"><img src="button.jpg"/></ a> <a href="www.something.com">WebSite</href>