How to get border width in jQuery/javascript

How do I parse the border width from

style="border: solid 1px black;"

in jQuery/javascript?

$elem.css('border-width')

doesn't do it.

Note I need to parse the width from the css, as the element may be display:none

Thanks

Edit I'm not actually using an in-line style, I just wrote it that way for simplicity as I didn't realise there was any behavoural difference. It seems to work fine for inline styles though, but still can't get any value from an applied css class.

You can just use parseInt(); to parse the border width from Npx to N:

var width = $elem.css('borderWidth'); // 150px
var parsed = parseInt(width);         // 150

I had a Google around and it appears in order to get the width of a border you must provide an explicit side of the border:

var borderWidth = $elem.css("border-left-width");

This is because it's possible for every border to have a different size, style and colour. Unfortunately it doesn't appear to be any simpler than this.

jQuery doesn't allow the use of - when referencing a CSS property, so remove the hypen and capitalise the following letter.

$elem.css('borderWidth');

Coded in jsFiddle to demonstrate.

var bordersOnBothSides = $("#measureMe").outerWidth() - $("#measureMe").innerWidth() );

To complete Generic's answer when seeking he left border and to include elusive's comment about radix:

<div style="border-style:solid;border-left-width:15px;"></div>

in script:

var width =parseInt($('div').css('borderLeftWidth'),10);
alert(width);

If u have equal border widh for element, or u need left, top border width, plain js:

elem.clientLeft; //get left border of element
elem.clientTop; //get top border of element

To get right, bottom border use jquery+css:

parseInt($(elem).css('borderLeftWidth'),10); // 10 use to get result in dec, not hex number system