根据ID加载css样式表？

Question

Hey how can I load a css stylesheet only based on id using javascript? Here is the code that I have:

<link id='bs-css' rel='stylesheet' href='bootstrap-cyborg.css' type='text/css' />

I want to be able to use it only on the div that I want so something similar to this code:

<div id="bs-css"> 
some code 
</div>

I tried this code but its not functioning like I wanted, here is the code:

<script type="text/javascript"> 
$(document).ready(function(){

if($("#bs-css").size()>0){
        if (document.createStyleSheet){
            document.createStyleSheet('bootstrap-cyborg.css');
        }
        else {
            $("head").append($("<link id='bs-css' rel='stylesheet' href='bootstrap-cyborg.css' type='text/css' />"));
        }
    }
});
</script> 

How can I load a css stylesheet only on the div that I want using an id and javascript?

Answer 1

Stylesheets are not bound to element IDs. CSS declarations within the stylesheet are. There is little point attempting to load a stylesheet in code as you propose.

Simply making a declaration for the ID you are targetting within a typical stylesheet is the best way to do this.