title: Display a single list from group of lists based on selected option using JQuery
body: <p>HTML code</p>
  <pre><code>&lt;Select id=&quot;alphalist&quot;&gt;
     &lt;option value=&quot;a&quot;&gt;A&lt;/option&gt;
     &lt;option value=&quot;b&quot;&gt;B&lt;/option&gt;
     &lt;option value=&quot;c&quot;&gt;C&lt;/option&gt;
  &lt;/Select&gt;
   
  &lt;div class=&quot;lists&quot; style=&quot;display&quot;&gt; 
    &lt;ul id=&quot;alist&quot;&gt; 
        &lt;li&gt;Axe&lt;/li&gt; 
        &lt;li&gt;Arc&lt;/li&gt; 
        &lt;li&gt;Apple&lt;/li&gt;
    &lt;/ul&gt;  
  &lt;/div&gt;
  
  &lt;div class=&quot;lists&quot; style=&quot;display:none&quot;&gt; 
    &lt;ul id=&quot;blist&quot;&gt; 
        &lt;li&gt;Bat&lt;/li&gt; 
        &lt;li&gt;Boat&lt;/li&gt; 
        &lt;li&gt;Bee&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;div id=&quot;c&quot; class=&quot;lists&quot; style=&quot;display:none&quot;&gt; 
    &lt;ul id=&quot;clist&quot;&gt; 
        &lt;li&gt;Cat&lt;/li&gt; 
        &lt;li&gt;Coat&lt;/li&gt; 
        &lt;li&gt;Cream&lt;/li&gt;  
    &lt;/ul&gt; 
  &lt;/div&gt;
  </code></pre>
  <p>Here I want to display only one list based on the option selected.</p>
  <p>By default I need option A, so that list with <em>id=&quot;alist&quot;</em> should be displayed and lists with <em>id=&quot;blist&quot;</em> and <em>id=&quot;clist</em> should be hidden.</p>
  <p>If I select option B, then second list should be displayed by hiding the first and third list.</p>
  <p>I have done this too:</p>
  <pre><code>&lt;script src = &quot;https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js&quot;&gt; &lt;/script&gt;
  </code></pre>
  <p>Please help me with this code below:</p>
  <pre><code>$(function() 
  {
   $('#alphalist').change(function(){
   $('.lists').hide();
   $('#' + $(this).val()).show();
   });
  });
  </code></pre>
  <p>After running the code first list is shown, but i see only blank area when other two options are selected.
  I'm not getting the right thing i needed. Did I miss anything here?</p>