Как обновить стиль ширины таблицы div после замены содержимого?

Question

У меня есть два деления. Один div содержит содержимое таблицы, другой содержит чистый текст. Я переключаю содержимое двух дел. Все браузеры прекрасно работают со стилем таблицы после замены, кроме одного браузера Android, который полностью игнорирует стиль таблицы и делает ширину ячейки td очень широкой.

  <div id="div1_id">Pure Text Content</div> 

  <div id="div2_id>     
         <table width="3000" border="0" cellspacing="0" cellpadding="0" >
            <colgroup>
                <col width="20px" />
                <col width="40px" />  
                 ... 
                <col width="30px" />
                <col width="auto" /> 
            </colgroup>
            <tbody>
              <tr>
                  <td>row1 col1</td>   
                  <td>row1 col2</td>
                   ...   
                  <td>row1 colx</td>   
                  <td>row1 coly</td>   
              </tr>
              ...
  </div>  
  <script type='text/javascript'> 
        var divOneContent = $('#div1_id').html();
        var divTwoContent = $('#div2_id').html();
        $('#divOneContent').html(divTwoContent);
        $('#divTwoContent').html(divOneContent);
  </script>

Есть ли какой-либо метод jquery, который я могу использовать, чтобы обновить стиль CSS в div после изменения содержимого div? Это может помочь мне обойти ошибку браузера для меня?

Answer 1

В jQuery есть метод.css(), который вы можете использовать:

 $('#div1_id').css(propertyName, value);

Вы также можете изменить класс:

 $('#div1_id').attr("class", "newClass");

Answer 2

Ваш код должен быть таким:

<script type='text/javascript'> 
$(document).ready(function(){
    var divOneContent = $('#div1_id').html();
    var divTwoContent = $('#div2_id').html();
    $('#div1_id').html(divTwoContent);
    $('#div2_id').html(divOneContent);
});