Lab - jQuery

Background: My footer JS to change links

• See how I modify the style for links on my pages to:
  • Wikipedia or Google search or other user-generated (and maybe unreliable) content,
  compared to:
  • other links.

• I am lazy so I do not do it manually in the source. I get JS to do it on page load.
• It makes use of jQuery.
• See the "user-generated content" section in footer.js included on every page.
• It changes the CSS class of some links. See my CSS file.

Lab - adapt this to your site

1. Start a new web page with a few links, some to Wikipedia and some to other sites.
2. Look in my footer.js. Copy these functions to your page:

    isUserContent
    fixUserContentLinks
   

3. Include my copy of jQuery. Get the URL right.
4. Include my CSS. Get the URL right.
5. To test it, in the console run:

     fixUserContentLinks(); 

   The Wikipedia links should turn red.

Notes and edits

• this in JS
• this and $(this) in jQuery

• Make a $(document).ready section that calls fixUserContentLinks() automatically.
• Pick certain types of links (e.g. to "all DCU sites") and get JS to find them at page load and modify their style.