Foo.ClassName = 'classname' не работает

Question

Первые шесть строк работают в строках класса.

function ShowShippingInfo() { 
    var QuoteInfo = document.getElementById("QuoteInfo"); 
    var ShippingInfo = document.getElementById("ShippingInfo"); 
    var Comments = document.getElementById("Comments"); 

    QuoteInfo.style.display = "none"; 
    ShippingInfo.style.display = "block"; 
    Comments.style.display = "none"; 

    QuoteInfo.className = 'tab'; 
    ShippingInfo.className = 'tab active'; 
    Comments.className = 'tab'; 
}; 

Вот мой HTML

<div onclick="ShowQuoteInfo();" style="border-left: thin solid #808080; border-right: thin solid #808080; border-top: thin solid #666666; border-bottom: thin none #999999; cursor: pointer; width: 100px; vertical-align: bottom; font-weight: normal; text-align: left;" class="tab"><strong class="auto-style198">Quote Info</strong></div> 

<div onclick="ShowShippingInfo();" style="border-left: thin solid #808080; border-right: thin solid #808080; border-top: thin solid #666666; border-bottom: thin none #999999; cursor: pointer; width: 100px; vertical-align: bottom; font-weight: normal; text-align: left;" class="tab"><strong class="auto-style198">Shipping Info</strong></div> 

<div onclick="ShowComments();" style="border-left: thin solid #808080; border-right: thin solid #808080; border-top: thin solid #666666; border-bottom: thin none #999999; cursor: pointer; width: 100px; vertical-align: bottom; font-weight: normal; text-align: left;" class="tab"><strong class="auto-style198">Comments</strong></div> 

Проблема, которую я имею, что не меняет имя класса, и я знаю вкладку класса и вкладки активные работы, так как она работает, когда я установил его manueally Также установка фоновый цвет тоже не работает.

Я использую Google Chrome

Пожалуйста, помогите
Благодарности

PS: вот ныряет он показывает и скрывающие

<div id="QuoteInfo"> 
              <table class="table_1"> 
               <tr> 
                <td style="vertical-align: top;" class="auto-style169" rowspan="2"><strong>Customer:</strong></td> 
                <td class="auto-style165" rowspan="2" style="vertical-align: top"> 
                 <asp:DropDownList ID="TCustomer" runat="server" Style="font-weight: bold;" AppendDataBoundItems="True" DataTextField="Name" DataValueField="Name" Height="27px" Width="171px"> 
                  <asp:ListItem></asp:ListItem> 
                 </asp:DropDownList> 
                 <br /> 
                 <asp:Label ID="LAddress" runat="server" Text="_"></asp:Label> 
                </td> 
                <td class="auto-style197"><strong>Quote</strong> <strong>No:</strong></td> 
                <td class="auto-style197"> 
                 <asp:TextBox ID="TQuoteNumber" runat="server" Width="182px" Enabled="False"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style196"><strong>Date:</strong></td> 
                <td class="auto-style196"> 
                 <asp:TextBox ID="TDate" runat="server" Width="182px" Enabled="False"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style194"><strong>Contact Person:</strong></td> 
                <td class="auto-style195"> 

                 <asp:TextBox ID="TContactPersonss" list="Contact" runat="server" Width="182px"></asp:TextBox> 
                </td> 
                <td class="auto-style195"><strong>Sales</strong> <strong>Person:</strong></td> 
                <td class="auto-style195"> 
                 <asp:TextBox ID="TSalesPerson" runat="server" Width="182px" Enabled="False"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style169"><strong>Status:</strong></td> 
                <td class="auto-style165"> 
                 <asp:DropDownList ID="TStatus" runat="server" Style="font-weight: bold;" AppendDataBoundItems="True" DataSourceID="SqlDataSource2" DataTextField="ItemName" DataValueField="ItemName" Height="27px" Width="171px"> 
                  <asp:ListItem></asp:ListItem> 
                 </asp:DropDownList> 
                 <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:DRPConnectionString %>" SelectCommand="SELECT [ListName], [ItemName] FROM [Status] WHERE ([ListName] = @ListName)"> 
                  <SelectParameters> 
                   <asp:Parameter DefaultValue="QuoteStatus" Name="ListName" Type="String" /> 
                  </SelectParameters> 
                 </asp:SqlDataSource> 


                </td> 
                <td class="auto-style165"><strong>Expires</strong> <strong>in</strong> <strong>(Days):</strong></td> 
                <td class="auto-style165"> 
                 <asp:TextBox ID="TExpiresIn" runat="server" Width="182px" TextMode="Number"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style179"><strong>Estimated Lead Time:</strong></td> 
                <td class="auto-style180"> 
                 <asp:DropDownList ID="TEstimatedLeadTimes" runat="server" Height="26px" Width="223px"> 
                  <asp:ListItem Selected="True">None</asp:ListItem> 
                  <asp:ListItem>1 to 2 weeks</asp:ListItem> 
                  <asp:ListItem>2 to 3 weeks</asp:ListItem> 
                  <asp:ListItem>3 to 4 weeks</asp:ListItem> 
                  <asp:ListItem>4 to 5 weeks</asp:ListItem> 
                  <asp:ListItem>5 to 6 weeks</asp:ListItem> 
                  <asp:ListItem>6 to 7 weeks</asp:ListItem> 
                  <asp:ListItem>7 to 8 weeks</asp:ListItem> 
                  <asp:ListItem>8 to 9 weeks</asp:ListItem> 
                 </asp:DropDownList> 


                </td> 
                <td class="auto-style180"><strong>PO Number:</strong></td> 
                <td class="auto-style180"> 
                 <asp:TextBox ID="TPurchaseOrder" runat="server" Width="182px"></asp:TextBox> 
                </td> 
               </tr> 
              </table> 
             </div> 




             <div id="ShippingInfo" style="display: none;"> 
              <table class="table_1"> 
               <tr> 
                <td style="vertical-align: top;" class="auto-style189">Name:</td> 
                <td class="auto-style165" style="vertical-align: top"> 

                 <asp:TextBox ID="TextBox16" list="Contact" runat="server" Width="182px" AutoPostBack="True"></asp:TextBox> 
                 <br /> 
                </td> 
                <td class="auto-style192">Same as Customer:</td> 
                <td class="auto-style157"> 
                 <asp:CheckBox ID="CheckBox3" runat="server" Checked="True" Text=" " /> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style189">Address:</td> 
                <td class="auto-style165"> 

                 <asp:TextBox ID="TextBox4" list="Contact" runat="server" Width="182px" AutoPostBack="True"></asp:TextBox> 
                </td> 
                <td class="auto-style191">City:</td> 
                <td class="auto-style165"> 
                 <asp:TextBox ID="TextBox5" runat="server" Width="182px" Enabled="False"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style188">State:</td> 
                <td class="auto-style171"> 

                 <asp:TextBox ID="TextBox15" list="Contact" runat="server" Width="182px" AutoPostBack="True"></asp:TextBox> 


                </td> 
                <td class="auto-style190">ZipCode:</td> 
                <td class="auto-style171"> 
                 <asp:TextBox ID="TextBox6" runat="server" Width="182px" AutoPostBack="True"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td class="auto-style179"><strong>Email Address:</strong></td> 
                <td class="auto-style180"> 

                 <asp:TextBox ID="TextBox17" list="Contact" runat="server" Width="182px" AutoPostBack="True"></asp:TextBox> 


                </td> 
                <td class="auto-style180">&nbsp;</td> 
                <td class="auto-style180">&nbsp;</td> 
               </tr> 

              </table> 
             </div> 

             <div id="Comments" style="display: none;"> 
              <table class="table_1"> 
               <tr> 
                <td style="vertical-align: top;" class="auto-style169"><strong>Comment 
                 <br /> 
                 For 
                 <br /> 
                 Customer:</strong></td> 
                <td class="auto-style165" style="vertical-align: top"> 
                 <asp:TextBox ID="TComments" runat="server" Height="143px" TextMode="MultiLine" Width="697px"></asp:TextBox> 
                </td> 
               </tr> 
               <tr> 
                <td style="vertical-align: top;" class="auto-style169"><strong>Comment 

                 For<br /> 
                 Sales Person<br /> 
                 (Not visible on Quote)</strong></td> 
                <td class="auto-style165"> 

                 <asp:TextBox ID="TextBox19" runat="server" Height="143px" TextMode="MultiLine" Width="697px"></asp:TextBox> 
                </td> 
               </tr> 
              </table> 
             </div> 

Answer 1

Ваш HTML не содержит никаких идентификаторов. Поэтому, когда вы ссылаетесь по id:

var QuoteInfo = document.getElementById("QuoteInfo"); 
var ShippingInfo = document.getElementById("ShippingInfo"); 
var Comments = document.getElementById("Comments"); 

нужный тэг html, чтобы иметь этот идентификатор.