Button Toggle ADF Javascript(Works in Firefox but not in IE. why ?)

Question

I have written a code to toggle button in ADF as follows:
<af:resource type="javascript">
function enableDisable(actionEvent){
alert("21");
document.getElementById('cb1').style.background='red';
document.getElementById('cb2').style.background='green';
alert("221");
function enableDisable1(actionEvent){
alert("21");
document.getElementById('cb1').style.background='green';
document.getElementById('cb2').style.background='red';
alert("221");
</af:resource>
<af:form id="f1">
<af:commandButton text="commandButton 1" id="cb1"
inlineStyle="background:'red';">
<af:clientListener method="enableDisable" type="click"/>
</af:commandButton>
<af:commandButton text="commandButton 2" id="cb2" inlineStyle="background:'green';">
<af:clientListener method="enableDisable1" type="click"/>
</af:commandButton>
This code works fine in Firefox, But My requirement is to run it in IE which it doesn't.
Kindly provide me solution or any pointers to resolve this.

Answer 1

I do not now what the function of this declaration is, but
please remove this from the beginning your css and IE7 also shows
bullets:
margin: 0;
padding: 1;
The padding: 1; is definitely an error cause there should be
at least something like px behind the 1, so like padding:
1px;