Recommended way of doing a vertical sidebar menu with sub-menus? (Accordion)

[A Jacom]

I am currently doing this like this: 

    <!-- Mobile Sidebar -->

    <div class="ui vertical inverted sidebar left menu">

        <div class="ui inverted accordion">

            <div class="item">

                <div class="title">Item 1 <i class="dropdown icon"></i></div>

                <div class="content">

                    <div class="vertical menu">

                        <a href="#" class="item">Dropdown Item 1.1</a>

                        <a href="#" class="item">Dropdown Item 1.2</a>

                        <a href="#" class="item">Dropdown Item 1.3</a>

                    </div>

                </div>

            </div>

            <div class="item">

                <div class="title">Item 2 <i class="dropdown icon"></i></div>

                <div class="content">

                    <div class="vertical menu">

                        <a href="#" class="item">Dropdown Item 2.1</a>

                        <a href="#" class="item">Dropdown Item 2.2</a>

                        <a href="#" class="item">Dropdown Item 2.3</a>

                    </div>

                </div>

            </div>

            

        </div>

    </div>

    <!-- /Mobile Sidebar -->

I think it works well except for the fact it doesn't follow the vertical sidebar menu's iconography (e.g. icons right-aligned). Is this how you would usually put expandable sub-menus into a sidebar menu?