title: jQuery to show div from id attribute
body: <p>I have two inputs</p>
  
  <pre><code>&lt;div class="form-group"&gt;
    &lt;label&gt;Store Username &lt;span&gt;*&lt;/span&gt;&lt;/label&gt;
    &lt;input required type="text" name="storeusername" class="form-control info" id="1" /&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
    &lt;label&gt;Store Name&lt;span&gt;*&lt;/span&gt;&lt;/label&gt;
    &lt;input required type="text" name="storename" class="form-control info" id="2" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What I am doing is that I when I click on an input it should first hide all divs and then pick id of that input and show its respective div…</p>
  
  <p>divs are these</p>
  
  <pre><code>&lt;div id="div1" class="infoDiv hidden"&gt;
    &lt;div class="company-story-content"&gt;&lt;h2 class="story-title"&gt;Store &lt;span class="color-text"&gt;Username&lt;/span&gt;&lt;/h2&gt;&lt;/div&gt;
    &lt;p&gt;Store username is unique and it will be used to find your store.&lt;/p&gt;
    &lt;p&gt;For example www.flashcart.com/&lt;span class="color-text"&gt;abc&lt;/span&gt; to find store that has &lt;span class="color-text"&gt;abc&lt;/span&gt; username.&lt;/p&gt;
    &lt;p&gt;Please keep in mind before choosing username.&lt;/p&gt;
    &lt;p&gt;
      &lt;ul&gt;
        &lt;li&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;Username can contain &lt;span class="color-text"&gt;Alphabets&lt;/span&gt;&lt;li&gt;
        &lt;li&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;Username can contain &lt;span class="color-text"&gt;Numbers&lt;/span&gt;.&lt;/li&gt;
        &lt;li&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;Username can contain &lt;span class="color-text"&gt;Underscores&lt;/span&gt;.&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/p&gt;
  &lt;/div&gt;
  &lt;div id="div2" class="infoDiv hidden"&gt;
    &lt;div class="company-story-content"&gt;&lt;h2 class="story-title"&gt;Some other&lt;span class="color-text"&gt;Username&lt;/span&gt; &lt;/h2&gt;&lt;/div&gt;
    &lt;p&gt;Div&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jquery</p>
  
  <pre><code>$(document).ready(function() {
    $(".info").click(function() {
      var id = $(".info").attr('id');
      $(".infoDiv").hide();
      $("#div"+id).removeClass("hidden");
    });
  });
  </code></pre>
  
  <p>But this is not working! No div is shown. Can anyone help me out with a bit of explanation?</p>