title: How to show or hide the next div based on form field input
body: <p>I have a form with many divs inside. Each div is categorized and has various fields to be filled up by the user. I want to have a flow here so that the user can fill the fields in the second div only after filling the fields in the first div. In short show the second div after filling the fields in the first div and so on.</p>
  
  <p>I tried using the following code:</p>
  
  <pre><code>$("div.form1 input").each(function () {
     if (this.value == "")
       ("div.form2").eq(1).hide();
     else
       ("div.form2").eq(1).show();
   });
  </code></pre>
  
  <p>and the div starts like this:</p>
  
  <pre><code>&lt;div class="myclass" id="form1"&gt;
  </code></pre>
  
  <p>But haven't got any success with this. Can anyone help me with this?</p>