title: gameQuery error : Cannot read property 'children' of undefined
body: <p>I am new to JQuery and gameQuery so I have probably got lots of things wrong, please bear with me. </p>
  
  <p>I was just following the tutorial to try to learn how to make web games but since the tutorial was slightly outdated, I needed to change some things. The problem is that I can't get my "game" to work.
  Here is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var PLAYGROUND_HEIGHT = 250;
  var PLAYGROUND_WIDTH = 700;
  var FPS = 30;
  var bg1speed = 0.5
  var bg2speed = 2
  var bg3speed = 8
  
  
  $("#playground").playground({height: PLAYGROUND_HEIGHT, width: PLAYGROUND_WIDTH});
  
  $("#playground").addGroup("background", {width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#playground").addGroup("actors", {width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#playground").addGroup("playerMissileLayer",{width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#playground").addGroup("enemiesMissileLayer",{width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  
  var background2 = new $.gQ.Animation({imageURL: "data/background2.png"});
  var background3 = new $.gQ.Animation({imageURL: "data/background3.png"});
  var background4 = new $.gQ.Animation({imageURL: "data/background4.png"});
  var background5 = new $.gQ.Animation({imageURL: "data/background5.png"});
  var background1 = new $.gQ.Animation({imageURL: "data/background1.png"});
  var background6 = new $.gQ.Animation({imageURL: "data/background6.png"});
  
  $("#background").addSprite("background1", {animation: background1, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#background").addSprite("background2", {animation: background2, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT, posx: PLAYGROUND_WIDTH});
  $("#background").addSprite("background3", {animation: background3, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#background").addSprite("background4", {animation: background4, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT, posx: PLAYGROUND_WIDTH});
  $("#background").addSprite("background5", {animation: background5, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT});
  $("#background").addSprite("background6", {animation: background6, width: PLAYGROUND_WIDTH, height: PLAYGROUND_HEIGHT, posx: PLAYGROUND_WIDTH});
  
  $("#playground").registerCallback(function(){
   if($("#background1").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background1").x(PLAYGROUND_WIDTH, False);
   };
   if($("#background2").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background2").x(PLAYGROUND_WIDTH, False);
   };
   if($("#background3").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background3").x(PLAYGROUND_WIDTH, False);
   };
   if($("#background4").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background4").x(PLAYGROUND_WIDTH, False);
   };
   if($("#background5").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background5").x(PLAYGROUND_WIDTH, False);
   };
   if($("#background6").x() &lt;= -PLAYGROUND_WIDTH){
    $("#background6").x(PLAYGROUND_WIDTH, False);
   };
   
   $("#background1").x(-bg1speed, true);
   $("#background2").x(-bg1speed, true);
   $("#background3").x(-bg2speed, true);
   $("#background4").x(-bg2speed, true);
   $("#background5").x(-bg3speed, true);
   $("#background6").x(-bg3speed, true);
  }, FPS);
  
  $("#playground").startGame()</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  
      &lt;head&gt;
          &lt;title&gt;Test&lt;/title&gt;
         &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
         &lt;script src="http://gamequeryjs.com/jquery.gamequery.js"&gt;&lt;/script&gt;
         &lt;script src = "data/Test.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Actually, this snippet is showing a different error message to my error. That's strange.</p>
  
  <p>Anyway, the error <em>I</em> am getting is this:</p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'children' of undefined
  at Object.waitForResources (jquery.gamequery.js:313)
  at jquery.gamequery.js:306
  </code></pre>
  
  <p>Does anyone have any idea why this is happening?</p>
  
  <p><strong>Side note:</strong> I think gameQuery should throw many more custom exceptions, it would make it a lot easier for people like me to work out what we are doing wrong.</p>