Display categories/subcategories with posts WP

Question

Basically as the title says I want to get list of categories and subcategories and then posts(with links to them) for those categories/subcategories.

This is the structure I'm trying to achieve:

<ul>
  <li>Category 1</li>
    <ul>
      <li>Subcategory 1 within category 1</li>
        <ul>
          <li>Post 1 within subcategory 1</li>
          <li>Post 2 within subcategory 1</li>
          <li>Post 3 within subcategory 1</li>
        </ul>
      <li>Subcategory 2 within category 1</li>
        <ul>
          <li>Post 1 within subcategory 2</li>
          <li>Post 2 within subcategory 2</li>
          <li>Post 3 within subcategory 2</li>
        </ul>
      <li>Subcategory 3 within category 1</li>
        <ul>
          <li>Post 1 within subcategory 3</li>
          <li>Post 2 within subcategory 3</li>
          <li>Post 3 within subcategory 3</li>
        </ul>
      <li>Posts that have no subcategory</li>
        <ul>
          <li>Post 1 with no subcategory</li>
          <li>Post 2 with no subcategory</li>
        </ul>
    </ul>
  <li>Category 2</li>
    <ul>
      <li>Subcategory 1 within category 2</li>
        <ul>
          <li>Post 1 within subcategory 1</li>
          <li>Post 2 within subcategory 1</li>
          <li>Post 3 within subcategory 1</li>
        </ul>
      <li>Subcategory 2 within category 2</li>
        <ul>
          <li>Post 1 within subcategory 2</li>
          <li>Post 2 within subcategory 2</li>
          <li>Post 3 within subcategory 2</li>
        </ul>
      <li>Subcategory 3 within category 2</li>
        <ul>
          <li>Post 1 within subcategory 2</li>
          <li>Post 2 within subcategory 2</li>
          <li>Post 3 within subcategory 2</li>
        </ul>
      <li>Posts that have no subcategory</li>
        <ul>
          <li>Post 1 with no subcategory</li>
          <li>Post 2 with no subcategory</li>
        </ul>
    </ul>
</ul>

Now so far after after reading everything I could found on the subject I have the following code:

<ul>   
    <?php 
        $get_parent_cats = array(
            'parent' => '0' //get top level categories only
        ); 

        $all_categories = get_categories( $get_parent_cats );//get parent categories 

        foreach( $all_categories as $single_category ){
            //for each category, get the ID
            $catID = $single_category->cat_ID;

            echo '<li><a href=" ' . get_category_link( $catID ) . ' ">' . $single_category->name . '</a>'; //category name & link
            $get_children_cats = array(
                'child_of' => $catID //get children of this parent using the catID variable from earlier
            );

            $child_cats = get_categories( $get_children_cats );//get children of parent category
            echo '<ul class="children">';
                foreach( $child_cats as $child_cat ){
                    //for each child category, get the ID
                    $childID = $child_cat->cat_ID;

                    //for each child category, give us the link and name
                    echo '<a href=" ' . get_category_link( $childID ) . ' ">' . $child_cat->name . '</a>';

                }
            echo '</ul></li>';
        } //end of categories logic ?>
</ul>

Now this code shows categories and subcategories well but I need to somehow loop through my posts and show them withing categories/subcategories. I have also tried to use fallowing code:

    <?php
        // get all the categories from the database
        $cats = get_categories(); 

            // loop through the categries
            foreach ($cats as $cat) {
                // setup the cateogory ID
                $cat_id= $cat->term_id;
                // Make a header for the cateogry
                echo "<h2>".$cat->name."</h2>";
                // create a custom wordpress query
                query_posts("cat=$cat_id&posts_per_page=100");
                // start the wordpress loop!
                if (have_posts()) : while (have_posts()) : the_post(); ?>

                    <?php // create our link now that the post is setup ?>
                    <a href="<?php the_permalink();?>"><?php the_title(); ?></a>
                    <?php echo '<hr/>'; ?>

                <?php endwhile; endif; // done our wordpress loop. Will start again for each category ?>
            <?php } // done the foreach statement ?>

        </div><!-- #content -->
    </div><!-- #container -->

This code shows all categories and posts within particular category, but the structure is not the one I want. I have been trying to combine these two snippets of code for two days, but nothing I try gives me the result I want. I am inexperienced with Wordpress and I could really use help with this.

Answer 1

This is the solution for anyone interested:

<ul>   
        <?php 
            $get_parent_cats = array(
                'parent' => '0' //get top level categories only
            ); 

            $all_categories = get_categories( $get_parent_cats );//get parent categories 

            foreach( $all_categories as $single_category ){
                //for each category, get the ID
                $catID = $single_category->cat_ID;

                echo '<li><a href=" ' . get_category_link( $catID ) . ' ">' . $single_category->name . '</a>'; //category name & link
                 echo '<ul class="post-title">';

                $query = new WP_Query( array( 'cat'=> $catID, 'posts_per_page'=>10 ) );
                while( $query->have_posts() ):$query->the_post();
                 echo '<li><a href="'.get_the_permalink().'">'.get_the_title().'</a></li>';
                endwhile;
                wp_reset_postdata();

                echo '</ul>';
                $get_children_cats = array(
                    'child_of' => $catID //get children of this parent using the catID variable from earlier
                );

                $child_cats = get_categories( $get_children_cats );//get children of parent category
                echo '<ul class="children">';
                    foreach( $child_cats as $child_cat ){
                        //for each child category, get the ID
                        $childID = $child_cat->cat_ID;

                        //for each child category, give us the link and name
                        echo '<a href=" ' . get_category_link( $childID ) . ' ">' . $child_cat->name . '</a>';

                         echo '<ul class="post-title">';

                        $query = new WP_Query( array( 'cat'=> $childID, 'posts_per_page'=>10 ) );
                        while( $query->have_posts() ):$query->the_post();
                         echo '<li><a href="'.get_the_permalink().'">'.get_the_title().'</a></li>';
                        endwhile;
                        wp_reset_postdata();

                        echo '</ul>';

                    }
                echo '</ul></li>';
            } //end of categories logic ?>
    </ul>