accessing elements within a css class

[Flappy]

I'm having problems trying to access properties within an element...

when the element is set up like this:

<span id="bla" style="color: white; border: 1px solid black">blablabla</span>

I am able to access the style properties no problem at all e.g.

alert(document.getElementById("bla").style.border);

how can I access those same properties if the style is defined by a class e.g.:

<style>
.button {
  color: white;
  border: 1px solid black;
}
</style>

<span id="bla" class="button">blablal</span>

?

thanks.

 

[BillyRayPreachersSon]

To write to the CSS property, you can still use the method you are using.

To read from the CSS property? In IE/Win, you could try reading the currentStyle attribute - which gives you all styles applied to an element, whether global, or inline.

For example - when viewing this page in IE, type the following into your URL bar:

javascript:alert(document.body.style.padding);

You will probably get an empty alert box. Now try:

javascript:alert(document.body.currentStyle.padding);

You should get one showing you 0px - which has come from the linked CSS rather than the element.

However... In browsers other than IE, you may well have to parse your way through the CSS itself... Although this is something I've never had to do, I'm sure that if you search the posts, you may well find someone else has.

Hope this helps,
Dan