使用Javascript switch语句在DIV中显示HTML表

我正在显示一个表，该表根据向下搜索时在HighMaps中选择的状态列出内容：

代码段：

                switch (e.point.name) {
                    case 'California':
                        $('#table').html('');
                        break;
                    case 'Virginia':
                        $('#table').html('');
                        break;
                    default:
                        $('#table').html('');
                        break;
                }
<div id="table"></div>

该表是通过使用PHP从DB中获取每个状态的数据来动态生成的。表格结构如下：

 <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h3 class="panel-title text-center">Company List - State</h3>
                        </div>
                        <table class="table table-hover" id="dev-table">
                            <thead>
                                <tr>
                                    <th>Company Name</th>
                                    <th>County</th>
                                    <th>Details</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>Company 1</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                                <tr>
                                    <td>Company 2</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                                    <td>Company 3</td>
                                    <td>Test County</td>
                                    <td>Company details.</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

在.html（"）内部生成的表输出如下所示：

 $('#table').html('<div class="container"> <div class="row"><div class="col-md-12"><div class="panel panel-primary"><div class="panel-heading"><h3 class="panel-title text-center">Company List - California</h3></div><table class="table table-hover" id="dev-table"><thead><tr><th>Company Name</th><th>County</th><th>Details</th></tr></thead><tbody><tr><td>Company 1</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><tr><td>Company 2</td><td>Test County</td><td>Company details are available to ACMA members only.</td></tr><td>Company 3</td><td>Test County</td><td>Company details.</td></tr></tbody></table></div></div></div></div>');

当公司名单很小的时候，一切都很好。一旦每个州的公司数量增加，生成的表代码变长，事情就停止了。我测试过了。如果我把生成的代码中太长的部分删除一半，那么一切都会重新开始工作。

html（）；中的字符数有限制吗？有没有更有效的方法来显示这些表格？