Grow your CSS skills. Land your dream job.

Last updated on:

Automatically Discover Document Links And Apply Class

$('a[href]').each(function() {
   if((C = $(this).attr('href').match(/[.](doc|xls|pdf)$/))) {
       $(this).addClass(C[1]);
   }
});

This will look through every a element on the page. If the href attribute of it has a .doc, .xls, or .pdf in it, it will apply the appropriate class name to it (e.g. class="doc")

Comments

  1. Mike
    Permalink to comment#

    Works like a champ!

  2. Permalink to comment#

    $(“a[href$='.doc']“).addClass(‘doc’);

  3. Tem Corner
    Permalink to comment#

    Although IE6 would degrade to a normal link, this can be done by CSS.


    a[href$='.doc'] { padding-right:16px; background: transparent url(images/doc.png) no-repeat top right; }

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".