Table row exapnd collapse jquery

Here is simple solution:

HTML:
<table border="1">
    <thead>
        <tr>
            <td></td>
            <td>Name</td>
            <td>Status</td>
            <td>Number#</td>
            <td>Data</td>
        </tr>
    </thead>
    <tbody>
        <tr class="parent" id="1">
            <td><a href="#">[+]</a>

            </td>
            <td>vivek</td>
            <td>Status</td>
            <td>Data</td>
            <td>Data</td>
        </tr>
        <tr class="child-1">
            <td colspan="5">
                <table border="1">
                    <tbody>
                        <tr class="parent" id="2">
                            <td><a href="#">[+]</a>

                            </td>
                            <td colspan="4">Application(1)</td>
                        </tr>
                        <tr class="child-2">
                            <td colspan="2">
                                <table border="1">
                                    <tbody>
                                        <tr class="parent" id="3">
                                            <td><a href="#">[+]</a>

                                            </td>
                                            <td>Data</td>
                                            <td>Data</td>
                                            <td>Data</td>
                                        </tr>
                                        <tr class="child-3">
                                            <td colspan="4">
                                                <table border="1">
                                                    <thead>
                                                        <tr>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                        <tr class="parent" id="4">
                                            <td><a href="#">[+]</a>

                                            </td>
                                            <td>Data</td>
                                            <td>Data</td>
                                            <td>Data</td>
                                        </tr>
                                        <tr class="child-4">
                                            <td colspan="4">
                                                <table border="1">
                                                    <thead>
                                                        <tr>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr class="parent" id="5">
                            <td><a href="#">[+]</a>

                            </td>
                            <td>Application(2)</td>
                        </tr>
                        <tr class="child-5">
                            <td colspan="2">
                                <table border="1">
                                    <tbody>
                                        <tr class="parent" id="6">
                                            <td><a href="#">[+]</a>

                                            </td>
                                            <td>Data</td>
                                            <td>Data</td>
                                            <td>Data</td>
                                        </tr>
                                        <tr class="child-6">
                                            <td colspan="4">
                                                <table border="1">
                                                    <thead>
                                                        <tr>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                        <tr class="parent" id="7">
                                            <td><a href="#">[+]</a>

                                            </td>
                                            <td>Data</td>
                                            <td>Data</td>
                                            <td>Data</td>
                                        </tr>
                                        <tr class="child-7">
                                            <td colspan="4">
                                                <table border="1">
                                                    <thead>
                                                        <tr>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                            <td>Header</td>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                        <tr>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                            <td>Data</td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>

JS:
var $trs = $('tr.parent')
.css("cursor", "pointer")
.attr("title", "Click to expand/collapse")
.click(function () {
    var $sibs = $(this).siblings('.child-' + this.id).toggle();
    $(this).siblings().not($sibs).not('.parent').hide()
});
$('tr[class*=child-]').hide().children('td');

Source URL: http://jsfiddle.net/arunpjohny/ZBpVW/