Home/ Questions/Q 7801869
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T01:04:49+00:00

In my code below the second table does not keep the same code it

  • 0

In my code below the second table does not keep the same code it appears to be overwritten by the code from the first table.

Is there a way so that I can preserve the code yet still replace my tables to be div’s and spans?

    <script>
    $(document).ready(function() {

    $('table').replaceWith( $('table').html()
       .replace(/<tbody/gi, "<div class='table'")
       .replace(/<tr/gi, "<div class='ccbnOutline'")
       .replace(/<\/tr>/gi, "</div>")
       .replace(/<td/gi, "<span")
       .replace(/<\/td>/gi, "</span>")
       .replace(/<\/tbody/gi, "<\/div")
    );

    });
    </script>
    </head>
    <body>


    <!-- This will be changed into div's and span's -->
    <table width="100%" cellpadding="0" cellspacing="0">
    <tbody>
    <tr>
    <td>one</td>
    <td>two</td>
    <td>three</td>
    </tr>
    </tbody>
    </table>
    <!-- End of Example Table -->


            <!-- This will be changed into div's and span's -->
    <table width="100%" cellpadding="0" cellspacing="0">
    <tbody>
    <tr>
    <td>one123</td>
    <td>two123</td>
    <td>three123</td>
    </tr>
    </tbody>
    </table>
    <!-- End of Example Table -->
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This is because you are replacing multiple objects with content of multiple objects.

    Here a fixed version:

    <script>
    $(document).ready(function() {
        $('table').each(function (){
            $(this).replaceWith( $(this).html()
                .replace(/<tbody/gi, "<div class='table'")
                .replace(/<tr/gi, "<div class='ccbnOutline'")
                .replace(/<\/tr>/gi, "</div>")
                .replace(/<td/gi, "<span")
                .replace(/<\/td>/gi, "</span>")
                .replace(/<\/tbody/gi, "<\/div")
            );
        });
    });
</script>

    I made it run through an .each loop and replaced the items one by one with the corresponding table.

    • 0