How can I add different Bootstrap menus to [menu_tree_output()][1]?

I know this is a very common question asked by a number of people earlier. I have found tons of answers, but none of them are working for me. However, I have tried a number snippets and here is the latest piece of code I am working on to get all menus and sub-menus.

    <?php 
      $menuTree = menu_tree_all_data('main-menu');
      $menu_tree_array = menu_tree_output($menuTree);
      print render($menu_tree_array);
    ?>

It works and prints all the submenus, however, It adds the same "menu" class to all parent ul. Rather I would like add sub-menu classes like the below output:

    <div class="navbar-collapse collapse">
      <div class="menu-top-menu-container">
        <ul id="menu-top-menu" class="nav navbar-nav">
          <li>
            <a href="http://example.com/">Home</a>
          </li>
          <li>
            <a href="http://example.com/biography/">Biography</a>
          </li>
          <li>
            <a href="#">Services</a>
            <ul class="sub-menu"> <!-- Like this. -->
              <li></li>
              <li></li>
            </ul>
          </li>
        </ul>
      </div>
    </div>



  [1]: https://api.drupal.org/api/drupal/includes%21menu.inc/function/menu_tree_output/7.x