title: Creating a sub-category select list from parent select list
body: <p>I am trying to create a select list that is populated depending on what the selected value is in the main category list. So far I've had little success, perhaps there is an easy way to do this, and I am over-thinking it.</p>
  
  <p>I don't know much about jQuery, still learning.
  Here is my attempt thus far</p>
  
  <p><a href="https://jsfiddle.net/b4cg04bj/3/" rel="nofollow">https://jsfiddle.net/b4cg04bj/3/</a></p>
  
  <pre><code>$('#category').on('change', function() {
    if(this.value = "Desktop Programming") {
      $("#subcategory").html("&lt;option value='C/C++'&gt;C/C++&lt;/option&gt;&lt;option value='Python'&gt;Python&lt;/option&gt;&lt;option value='Visual Basic'&gt;Visual Basic&lt;/option&gt;&lt;option value='Visual C#'&gt;Visual C#&lt;/option&gt;");    
    } 
    else if(this.value = "Graphic Design") {
     $("#subcategory").html("&lt;option value='Adobe Illustrator'&gt;Adobe Illustrator&lt;/option&gt;&lt;option value='Adobe Photoshop'&gt;Adobe Fireworks&lt;/option&gt;&lt;option value='Adobe Photoshop'&gt;Adobe Photoshop&lt;/option&gt;&lt;option value='Adobe Photoshop'&gt;Adobe InDesign&lt;/option&gt;&lt;option value='Adobe Lightroom'&gt;Adobe Lightroom&lt;/option&gt;&lt;option value='Gimp'&gt;Gimp&lt;/option&gt;&lt;option value='Coral Draw'&gt;Coral Draw&lt;/option&gt;");  
    }
  });
  </code></pre>
  
  <p>As it stands just now, when you select Desktop Programming the list behaves as I was expecting.. however after you select something you can't change the parent select box. As I said, I am new to jQuery and feel as though I'm doing this incorrectly so I would appreciate any alternative methods of accomplishing this.
  I feel as though the reason the list isn't updating is because after the function runs it stops listening for the on change event.</p>