title: Showing div based on filled form field
body: <p>I have this script where I use a slider to show some elements of a form. So far so good. The way I'm doing it is by having a slider (can't use a multistep form since it uses a plugin not allowing multistep forms, plus some graphic behaviors) and a button that goes to the next slider. So now I need that button (not part of the form) to show only if a certain field is filled.</p>
  
  <p>I tried teh following, but it's not working, I assume some error but can't figure what. My code is as follows:</p>
  
  <pre><code>$('#clientname').change(function() {
      var clientVal = $("input").val() == '';
  $(".next").hide();
  
  if ($('#clientname').val() != '').show();
  
  else
  
  $('.next').hide();
  });
  </code></pre>
  
  <p>and the html as follows:</p>
  
  <pre><code>&lt;div class="b40-right"&gt;
  
  
                          &lt;h3&gt;The Basics&lt;/h3&gt;
                          &lt;div class="label"&gt; Your Name (required)&lt;/div&gt;
                          &lt;div class="inputes"&gt; &lt;span class="wpcf7-form-control-wrap your-name"&gt;&lt;input id="clientname" type="text" name="your-name" value="" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" size="40" /&gt;&lt;/span&gt; &lt;/div&gt;
                          &lt;div class="label"&gt;Your Email (required)&lt;/div&gt;
                          &lt;div class="inputes"&gt;    &lt;span class="wpcf7-form-control-wrap your-email"&gt;&lt;input type="text" name="your-email" value="" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" size="40" /&gt;&lt;/span&gt; &lt;/div&gt;
                          &lt;div class="label"&gt;Type of Business&lt;/div&gt;
                          &lt;div class="inputes"&gt;    &lt;span class="wpcf7-form-control-wrap type-of-business"&gt;&lt;textarea name="type-of-business" class="wpcf7-form-control  wpcf7-textarea" cols="40" rows="10"&gt;&lt;/textarea&gt;&lt;/span&gt; &lt;/div&gt;
  
  
  
                      &lt;/div&gt;
  
                      &lt;a class="next" href="javascript:stepcarousel.stepBy('mygallery2', 1)"&gt;&lt;img id="nextbut1" src="&lt;?php bloginfo('template_directory'); ?&gt;/images/next.png" alt="" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>any help on what am I doing wrong? Is there a better approach/solution? (I'm not a programmer as you may figure)</p>
  
  <p>Thank you in advance!</p>