Actually I want something like that:
var color = #000;
$(".div").find("li").css({"border-left": '5px solid [`I want to add this variable (color) here`]});
Please help me.
Thank you.
3 Answers
If you can use ES6 then a template literal is a good choice here. It uses backticks instead of other types of quotes.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
var color = "#000"; //change this to be a string as @Nikos mentioned
$(".div").find("li").css({"border-left": `5px solid ${color}`});
6 Comments
robbieAreBest
Looks like you beat me by 4 seconds, great minds :)
Nikos M.
color should be a string though,
WillD
Good point. Ill update
WillD
Did you see the note about your
var color = #000 missing quotes? |
var color = "#00f";
$("#button").click(function(){
$("div").css({"border": "5px solid " + color});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="button">Add Border</button>
<div>Hi, I am a div</div>
Comments
$(".div").find("li").css({"border-left": `5px solid ${color}`});
