Replacing a stylesheet in a complex header

[Hrk!]

I have a website that I need to create a stylesheet switcher for. Now I am pretty much self taught when it comes to all things html/css/js so please forgive my newbness in advance. I modified some code to suit my needs but I can't seem to find how to change the code to target a specific line in the head.Currently this is what I have:\[code\]<ul id="nav"> <li><a href="http://stackoverflow.com/questions/15738124/#" rel="http://files.enjin.com/149304/theme-Dark.css">Dark</a></li> <li><a href="http://stackoverflow.com/questions/15738124/#" rel="http://files.enjin.com/149304/theme-Light.css">Light</a></li></ul><script>$(document).ready(function() { $("#nav li a").click(function() { $("link").attr("href",$(this).attr('rel')); return false; });});$(document).ready(function() { if($.cookie("css")) { $("link").attr("href",$.cookie("css")); } $("#nav li a").click(function() { $("link").attr("href",$(this).attr('rel')); $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'}); return false; });});$(document).ready(function() { if($.cookie("css")) { $("link").attr("href",$.cookie("css")); } $("#nav li a").click(function() { $("link").attr("href",$(this).attr('rel')); $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'}); return false; });});</script>\[/code\]As it stands at the moment this code just changes every href in the head and destroys the page. This is the href I need to change (it lives on line 22):\[code\]<link href="http://stackoverflow.com/questions/15738124/Home - Oceanian Gaming Community_files/theme.php" media="screen" rel="stylesheet" type="text/css">\[/code\]Any help would be very much appreciated.