Raggruppare risultati di due tabelle

[netkingZ]

Salve a tutti questo è il codice che ho sviluppato:

<script>
$(document).ready(function(){
    
    $(".containerTeam").hide();
    
    
    $("h2.trigger01").css("cursor","pointer").click(function(){
        $(this).next(".containerTeam").slideToggle("slow");
    });


});




</script>

$thread_qry1 = "SELECT * FROM `xt_teams` AS u, `xt_player` AS m WHERE (u.name_team = m.team_name AND m.accepts = 1) ORDER BY u.console_team";
      $row1 = XenForo_Application::get('db')->fetchAll($thread_qry1);
      $teamCurrent = '';      $i = 1;    $count = 1;        $size = count($row1);                                          foreach ( $row1 AS $rows1 ) {                                   if ($teamCurrent != $rows1['name_team'])                   {                    $ii = $i++;                    if($teamCurrent != '') echo ('</div>');                    echo ('<h2 class="trigger01">                            <div style="height:100px; width:100%; background-color:red"></div>                                   </h2>                                         <div class="containerTeam">                                                                  <div style="height:50px; width:100%; background-color:green"></div>                                                              ');
                        $teamCurrent = $rows1['name_team'];                    }                                         echo ('                                <div style="height:50px; width:100%; background-color:yellow"></div>                                   ');                                                         if($count == $size)                                echo ('</div>');                          $count ++;                           } 

Con tutto questo codice ottengo esattamente ciò che voglio , cioè che per ogni div ROSSO e che sono quando clicco sul div ROSSO vengano mostrati i div Verde e GIALLO , e i dati come potete notare derivano da due tabelle differenti che hanno in comune il name_team = team_name.


Mantenendo il codice qui sopra scritto vorrei creare per ogni div ROSSO delle categorie che li raggruppino.
Immaginate di avere una serie di libri ( i div ROSSI che contiene il div VERDE e quello GIALLO ) e che vogliate dividerli per genere , quindi raggruppando tutti i libri horror per esempio insieme , tutti i libri di avventura insieme e cosi via.


ESEMPIO VISIVO:

-- CATEGORIA: HORROR: <-- ELEMENTO MANCANTE NEL CODICE SOPRA
   ---- LIBRO UNO (DIV ROSSO ) composto da :
      ----- DIV VERDE 
      ----- DIV GIALLO


   ---- LIBRO DUE (DIV ROSSO ) composto da :
      ----- DIV VERDE 
      ----- DIV GIALLO


-- CATEGORIA: AVVENTURA: <-- ELEMENTO MANCANTE NEL CODICE SOPRA
   ---- LIBRO TRE (DIV ROSSO ) composto da :
      ----- DIV VERDE 
      ----- DIV GIALLO


   ---- LIBRO QUATTRO (DIV ROSSO ) composto da :
      ----- DIV VERDE 
      ----- DIV GIALLO

​

Scusate non so se mi sono fatto capire ... cmq come posso realizzare ciò che mi serve?


Grazie per la cortese attenzione