How to grab div tag value and use it in css file?

Question

I am working on a web application where I only have access to edit the css file. I am trying to grab the value (Ex: user23) of this div tag:

 <div id="username">user23</div>

Then use it in the css file to display the user's image.

 div.something {
        content: url(https://website.com/pic?id= /*user name will go here*/ );
 }

I have tried methods like attr() to grab the value but instead it grabs "username" instead of the value.

This **cannot** be done with pure CSS. Are you able to use JavaScript at all? It's possible to construct the relevant CSS values utilising JavaScript, but not with pure CSS. — Obsidian Age, Nov 28 '17 at 20:40
@ObsidianAge I created a javascript file but I cannot add it to html file. How can I call or reference js file from css file? — Luis Angamarca, Nov 30 '17 at 19:07
^ You can't reference a JavaScript file from a CSS file. You **must** reference the JavaScript file from the HTML file. That is done with ``. — Obsidian Age, Nov 30 '17 at 19:09

score 0 · Answer 1 · answered Nov 28 '17 at 20:42

0

You cannot do that with pure css. You should use JQuery and do something like that :

$("#theDiv").append("<img id='theImg' src='theImg.png'/>");

answered Nov 28 '17 at 20:42

Clément Probola

1 Answers1