title: How to load local text information into <div> section
body: <p>I am trying to draw a diagram by using below codes.
  It works well.
  As you can see, I should put some text information in the <code>div</code>.
  If there is a <code>sample.txt</code> which includes this information in local drive, can I load it into <code>div</code> section dynamically instead of putting it manually?</p>
  
  <pre><code> &lt;!DOCTYPE html&gt;
   &lt;html &gt;
     &lt;head&gt;
       &lt;meta charset="UTF-8"&gt;
       &lt;title&gt;Sample Diagram&lt;/title&gt;
     &lt;/head&gt;
     &lt;body&gt;
       &lt;div class="diagram"&gt;
       Title: Diagram
    &lt;!--   Participant FIRST
       Participant SECOND
       Participant D  
      Participant F
      Participant G     //--&gt; 
      E-&gt;F: 2
       SECOND-&gt;FIRST: 1
       FIRST-&gt;SECOND: 1
       C--&gt;SECOND: Request token
      C-&gt;E: 2
       SECOND-&gt;FIRST: Forward request
       FIRST-&gt;&gt;C: Send token
       &lt;/div&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/js-sequence-diagrams/1.0.4/sequence-diagram-min.js'&gt;&lt;/script&gt;
       &lt;script src="js/index.js"&gt;&lt;/script&gt;
     &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <h1>UPDATE</h1>
  
  <pre><code>/test/index.html
  /test/js/index.js
  /test/js/sample.txt
  /test/sample.txt
  </code></pre>
  
  <h1>index.js</h1>
  
  <pre><code>// js-sequence-diagrams by bramp &lt;http://bramp.github.io/js-sequence-diagrams/&gt;
  $(".diagram").sequenceDiagram({theme: 'simple'});
  $(function(){
   $.get("sample.txt", function(data) {
       $(".diagram").text(data);
   });
  });
  </code></pre>
  
  <h1>sample.txt</h1>
  
  <pre><code>Title: Diagram
  SECOND-&gt;FIRST: 1
  FIRST-&gt;SECOND: 1
  C--&gt;SECOND: Request token
  C-&gt;E: 1
  SECOND-&gt;FIRST: Forward request
  FIRST-&gt;&gt;C: Send token
  </code></pre>
  
  <h2>Without inner text</h2>
  
  <pre><code> &lt;!DOCTYPE html&gt;
   &lt;html &gt;
     &lt;head&gt;
       &lt;meta charset="UTF-8"&gt;
       &lt;title&gt;Sample Diagram&lt;/title&gt;
     &lt;/head&gt;
     &lt;body&gt;
       &lt;div class="diagram"&gt;
  
       &lt;/div&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.2/raphael-min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js'&gt;&lt;/script&gt;
       &lt;script src='http://cdnjs.cloudflare.com/ajax/libs/js-sequence-diagrams/1.0.4/sequence-diagram-min.js'&gt;&lt;/script&gt;
  
       &lt;script src="js/index.js"&gt;&lt;/script&gt;
  
     &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>