How to change text element content using Snap.svg

Question

I am trying to change the content of a text element in my SVG. The purpose of this will be to dynamically update a mode of an object that will show up as a text element.

I have the text element wrapped in a element as follows:

<g id="CarAMode">
   <text transform="matrix(1 0 0 1 177.17 133.6)" class="st2">PASSENGER</text>
</g>

I then load the SVG in JS upon loading:

var hoistShaft = Snap('#HoistShaft');

Snap.load( "/svg/Hoistway.svg", function(f) {
   hoistShaft.append(f);
   var carMode = hoistShaft.select('#CarAMode');

   carMode.attr({       // I thought this is how its done..
      text: 'default'
   });
}

After loading up my page, I expected 'PASSENGER' to become 'default' but no change occurs. I also dont get any errors in console, so syntax seems to be right.

Any help please on how I can change the text element?

Answer 1

Given the svg code, as stated on the comments, you can select using the common CSS selection query:
hoistShaft.select('#CarAMode text'); or hoistShaft.select('#CarAMode').select('text');