title: I can't get jQuery knob to display a value
body: <p>First, thanks in advance for any advice.  I've looked everywhere for a solution and can't find anything.  Admittedly, Javascript isn't my strong suit.</p>
  
  <p>I'm using fineuploader to upload files, one-by-one and using jQuery knob to display the upload progress.  The knob is for upload progress updates only and shouldn't be interactive.  I can style it, set the size completion % of the knob, etc. but I cannot get it to display the upload % in the middle.  </p>
  
  <p>Here's my code. </p>
  
  <pre><code>}).on('upload', function(event, id, name) {
      var progressField = $('#' + 'pic' + (id + 1)).parent();
      progressField = progressField.parent();
      var picName = $(progressField).children('label:first').html();
      $(progressField).attr("class", "uploaderBox");
      $(progressField).html('');
      $('.uploaderBox').html('&lt;span class="picName"&gt;Uploading ' + picName + '...&lt;/span&gt;');
      $(progressField).append('&lt;div id="progressKnob"&gt;&lt;/div&gt;');
      $("#progressKnob").knob({
                              "displayInput": true,
                              "thickness": .15,
                              "width": 70,
                              "fgColor": "#FF00FF",
                              "inputColor": "#000000"
                              });
  }).on('progress', function(extra, id, name, uploadedBytes, totalBytes){
      var currentProgress = Math.round((uploadedBytes / totalBytes) * 100);
      $('#progressKnob')
          .val(currentProgress)
          .trigger('change');
  }).on('complete', function(event, id, name, responseJSON){
      $('#progressKnob')
          .val(100)
          .trigger('change');
  </code></pre>