What am I doing wrong on this interactive SVG? Please help.

I watched the tutorial on youtube on creating the svg and making an interactive color changing character. I have tried to implement it but I’m not doing something right and am a little lost on the code.  I was wondering if anyone could tell me what I am doing wrong.

The SVG File

1. Has 18 groups that can color change each in a different layer but not grouped within the layers
2. The layer names are as follows
   1. Owl_Wing_Spots
   2. Owl_Wings
   3. Owl_Belly
   4. Owl_Body
   5. Trunk
   6. Leaf_Outline
   7. Leaf_1
   8. Leaf_2
   9. Leaf_3
   10. E2_Ear_Spots
   11. E2_Ear_Tail
   12. E2_Body
   13. E1_Ear_Spots
   14. E1_Ear_Tail

         15.  E1_Body

     16. Wall_Color

     17. Bird_Body

     18.   Bird_Butterfly_Wing

• I put the notify(this, "select"); on each layer
• I referenced http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js for the javascript file in AI and I also created a js file that is the same as the one in the video named svg.js (but neither made a difference)

The Edge Animate File

• I added the SVG file named “elephant_tree2” and then added the following code to the CompositionReady Area

// Load Edge Commons

yepnope({

load: "http://cdn.edgecommons.org/an/1.0.0/js/min/EdgeCommons.js",

complete: function() {

                        // Enable SVG access

                        EC.accessSVG(sym.$("elephant_tree2")).done(

                                        function(svgDocument){

                                                        // add event listener

                                                        svgDocument.addEventListener("select", function(event) {

                                                                         // Remember selected part

                                                                         sym.setVariable("selectedPart", event.target);

                                                                         // show the id of the selected part in the textfield

                                                                         sym.$("selectedPartTxt").html( event.target.id );

                                                        });

                        });

        }

});

// insert code to be run when the composition is fully loaded here

• I added a selectedPartTxt text box and named it that too.

None of the groups on the SVG are recognized and the selectedPartTxt does not change.  I suspect it may have something to do with the fact there are groups instead of one part but I don’t know how to fix it.

I was also wondering if someone could tell me how to use an SVG for the color chart too instead of recreating it in Edge Animate.  I haven't tried to to the color part of the SVG because I still can't get the mouse click to work when on a group that changes.

Any help would be appreciated.

Thanks!

Cherie