title: How to create an unordered list using jQuery
body: <p>I have got a javascript object as follows</p>
  
  <pre><code>var course = { 
      chapter: "chapter 1",
      chapter: "chapter 2",
      lesson: "lesson 1",
      lesson: "lesson 2",
      lesson: "lesson 3",
      chapter: "chapter 3",
      lesson: "lesson 1",
      page: "page 1",
      page: "page 2",
      page: "page 3",
      lesson: "lesson 2",
  }
  </code></pre>
  
  <p>Now, I want to generate my unordered list as follows:</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;chapter 1&lt;/li&gt;
      &lt;li&gt;chapter 2&lt;/li&gt;
      &lt;ul&gt;
          &lt;li&gt;lesson 1&lt;/li&gt;
          &lt;li&gt;lesson 2&lt;/li&gt;
          &lt;li&gt;lesson 3&lt;/li&gt;
      &lt;/ul&gt;
      &lt;li&gt;chapter 3&lt;/li&gt;
          &lt;ul&gt;
              &lt;li&gt;lesson 1&lt;/li&gt;
              &lt;ul&gt;
                  &lt;li&gt;page 1&lt;/li&gt;
                  &lt;li&gt;page 2&lt;/li&gt;
                  &lt;li&gt;page 3&lt;/li&gt;
              &lt;/ul&gt;
              &lt;li&gt;lesson 2&lt;/li&gt;
          &lt;/ul&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>How can I achieve that using jQuery or JavaScript. Any help is much appreciated. </p>