I'm trying to dynamically update the color to a mini triangle above my rectangle.
CSS
pre:before {
content: '';
position: absolute;
width: 0;
height: 0;
bottom: 100%;
left: 5em;
border: .5rem solid transparent;
border-top: none;
border-bottom-color: #00ff5c; <<<<<<---------------- hard coded
}
pre {
color: white;
background-color: #212121;
overflow-x: auto;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
display: flex;
justify-content: space-between;
}
jQuery
$("pre").css("border", "2px solid #c12222");
$("pre:before").css("border-bottom-color", "#c12222");
I don't see any effect.
Please suggest
