title: Can't get selectors to work with the JQuery SVG library
body: <p>I'm having trouble getting an externally loaded SVG to do what I want it to with Keith Wood's SVG library.</p>
  
  <p>I can load an external SVG fine with:</p>
  
  <pre><code>$(document).ready ( function () {  
        $("#some_id").svg({  
              loadURL: 'my_file.svg',  
              onLoad: my_function,  
              settings: {}  
            });  
  });
  </code></pre>
  
  <p>I can get my_function working fine. I just can't get selectors working properly.</p>
  
  <p>My externally-loaded SVG takes the form:</p>
  
  <pre><code>&lt;g id="parent_id"&gt;
    &lt;path id = "child_1_id"  /&gt;
    &lt;path id="child_2_id" /&gt;
    etc.  &lt;/g&gt;
  </code></pre>
  
  <p>I can colour the whole parent_id element fine with:</p>
  
  <pre><code>svg.style('#parent_id {fill: blue}')
  </code></pre>
  
  <p>But when I try:</p>
  
  <pre><code>svg.style('#child_id {fill: blue}')
  </code></pre>
  
  <p>nothing happens.</p>
  
  <pre><code>svg.style('g&gt; path {fill: blue}') svg.style('g#parent_id &gt; path {fill: blue}')
  </code></pre>
  
  <p>both work fine - no problem. But the minute I introduce #child_id, for instance:</p>
  
  <pre><code>svg.style('g#parent_id &gt; path#child_id {fill: blue}')
  </code></pre>
  
  <p>nothing happens. I want to be able to style all the child_id elements separately. What am I missing?</p>