So I now changed the code up for what you said:
var thumbStyles = document.createElement("style");
document.head.appendChild(thumbStyles);
thumbStyles.sheet.insertRule(
"figure#styleThumbs { \
position: absolute; \
left: 0px; \
bottom: 0px; \
} \
")
thumbStyles.sheet.insertRule(
"figure#styleThumbs img { \
outline: 1px solid black; \
cursor: pointer; \
opacity: 0.75; \
} \
")
thumbStyles.sheet.insertRule(
"figure#styleThumbs img:hover { \
outline: 1px solid red; \
opacity: 1.0; \
} \
");
Their is no more errors and the style is now inserted, but their is no styles inside of it. I also removed the index 0 at the end of the inserts.
