laravelのforeachで表示する一覧をアコーディオンメニューに収納したい。

Question

前提・実現したいこと

コードにある<div class="toggle">の「0円の店舗」をクリックすれば

<div class="child">の中にあるforeachが アコーディオンで展開されるようにしたいのですが、上手くアコーディオンに なりません、この場合はどのように書けば上手くいきますか？

該当のソースコード

                        <div class="toggle">
                            <tr>
                                <td>0円の店舗</td>
                                <td></td>
                            </tr>
                        </div>
                        <div class="child">
                            @foreach ($shops_0 as $shop)
                                <tr>
                                    <td>{{ $shop->shop_name }}</td>
                                    <td>0円</td>
                                </tr>
                            @endforeach
                        </div>

                        <script>
                            $('.child').hide();
                            $('.toggle').on('click',function(){
                                $(this).toggleClass('open');
                                $(this).next('.child').slideToggle();
                            });
                        </script>

Comments

[m.ts10806]

なぜtableタグがないのにtr、tdがあるのでしょうか。まずは静的なhtmlで想定のhtmlを作られては。

[harusyoui]

いやあのこれはtableタグの中の一部分を抜き出してるんですよ。

[m.ts10806]

わかるように書かないと誰もがそこしか突っ込まないですよ。それと静的なHTMLで実現できないものは動的なものでもできませんし。

[kei344]

「うまくできない」とは「何をしたときに」「どうなると思って」「どうなったのか」を、出ているエラーなどと併せて、具体的に記述されたほうが回答を得られやすいと思います。

[x_x]

エラーは出ていませんか？
jQueryの読み込み部分はどうなっているのでしょうか？