Background colour value between JavaScript and jQuery -

i trying background colour of coloured box when clicked , subsequently storing in variable using either javascript or jquery. although trivial information, noticing is, javascript , jquery show in different manner.

for example, coloured box using red (in css, giving background-color: red). therefore, when click box id (#box) using following code in javascript

var bcolour = document.getelementbyid("box").style.backgroundcolor; 

console.log(bcolour) gives me value red.

whereas same in jquery

var bcolour = $(#box).css("background-color"); 

console.log(bcolour) gives me value rgb(255, 0, 0).

is there way jquery display bcolour value identical javascript shows?

jquery.css uses getcomputedstyle function. ref

there no difference between getcomputedstyle(object).getpropertyvalue(property) , jquery.css

for example

document.getelementbyid("mydiv").style.backgroundcolor // return red;  getcomputedstyle(document.getelementbyid("mydiv")).getpropertyvalue("background-color"); // return rgb(255, 0, 0);  $('#mydiv').css("backgroundcolor") // return rgb(255, 0, 0);