How to change a whole stylesheet.

How to change a whole stylesheet.

Hi!
My code seems to work perfectly, but i wanna  ask if there is another way to change a stylesheet in a document.
My code is simple:
  1. <head>
    <link rel="stylesheet" href="../css/main.css" type="text/css" /> 
    </head>

    <body>
    <h1>BIG</h1>
    <button type="submit" id="btn" value="ok">change</button>
    <script type="text/javascript">
    $(document).ready(function(){
    $('#btn').click(function()
      $('link').attr('href','../css/second.css');
    })
    });
    </script>
    </body>

after clicking a button new attribute is setting for href of link tag which is new path to the css file.
Simple one, but i think there are couple of other approaches. Do you have ones?
Please share them with me:)
Sincerely Pawel