Problem with Extension tutorial

[michael_andrews]

I'm working on the properties extension tutorial where you just set the element to the value of a custom text box. However, I'm getting hello world undefined when I try to set the text, as in my text box variable is undefined. Can you see what I'm missing?

define( [
  'jquery'
  ],
  function ( $ ) {
  'use strict';


  return {
  definition:
  {
  //set our properties
  type: "items"
  , component: "accordion"
  , items:
  {
  appearancePanel: 
  {
  uses: "settings"
  , items:
  {
  //create a text box for a custom property
  MyStringProp: 
  {
  ref: "myDynamicOutput"
  , type: "string"
  , label: "my first property"
  , defaultValue: "foo"
  }
  }
  }
  }

  }
  , paint: function ( $element, layout ) {


  console.log(layout);
  var id = layout.qInfo.qId + '_helloworld';
  var $helloWorld = $( '#' + id );
  var $txt = layout.myDynamicOutput;
  if ( !$helloWorld.length ) {
  console.log( 'No element found with the given Id, so create the element' );
  $helloWorld = $( document.createElement( 'div' ) );
  $helloWorld.attr( 'id', id );
  $helloWorld.html( 'Hello World' + layout.myDynamicOutput );
  $element.append( $helloWorld );
  } else {
  console.log( 'Found an element with the given Id, so just change it' );
  $helloWorld.html( 'Hello World' + layout.myDynamicOutput );
  }


  }
  };
  } );