title: JQuery UI Widget Programming
body: <p><br>
  Hi, i'm creating chat ui with JQueryUI.
  <br>
  here some code:</p>
  
  <pre><code>$.widget("ui.chatwindow", {
      options: {
          nickname: "obama";
      },
      setNickname: function(nick){
          var self = this;
          var id_pre = 'wchat_' + self.options.nickname;
          $('#' + id_pre + '\\:name').text(self.options.nickname);
      },
      setStatus: function(status){
              var self = this;
              var id_pre = 'wchat_' + self.options.nickname;
              switch(status){
                  case 1:
                      $('#' + id_pre + '\\:status').removeAttr('class');
                      $('#' + id_pre + '\\:status').addClass('chat-icon-online');
                      $('#' + id_pre + '\\:status').attr('title','Online');
                      break;
                      ...
                  default:
                      break;                    
              }
              ...
          },
      ...
  }
  </code></pre>
  
  <p>My Question is i always write in every method: <br></p>
  
  <pre><code>var self = this;
  var id_pre = 'wchat_' + self.options.nickname;
  </code></pre>
  
  <p>to change element class or text content <br>
  is this a good or efficient way to code? <br>
  let me know the good and efficient way to do this.
  <br><br>
  thanks for your kind.</p>