Conditionally show the following form field based on the selection of a dropdown in an Unbounce form

unbounce-conditional-form-field-reveal.html

<script>
/*
Unbounce Community :: Tips & Scripts :: Conditional Form Field Based on Dropdown 
TS:0002-04-060
***********************
Do not remove this section. It helps our team track useage of external workarounds.
*/
  
  var submitBtn = $("#lp-pom-button-10"); // Add ID of Submit Button
  var field = $("#cats_or_dogs");  // Add ID of Dropdown field
  
  var conField1 = field.parent().next();
  var conField2 = conField1.next();
  
  var topPos = conField1.position().top;
  conField2.css({top: topPos});        
  
  conField1.css("display", "none");
  conField2.css("display", "none");
  
  var fieldHeight = conField1.height();
  var space = fieldHeight*2+37;
  var halfSpace = space/2;
  
  var moreFields = $(conField2).nextAll();
  moreFields.animate({top: "-=" + space},0); 

  var i = true;
  $(field).change(function() {
    if (this.selectedIndex == 1) {
      conField1.fadeIn("slow");
      conField2.fadeOut("slow");
      if (i) {
        fieldAdjust();
        i = false;
      }
    } else if (this.selectedIndex == 2) {
      conField1.fadeOut("slow");        
      conField2.fadeIn("slow");
      if (i) {
        fieldAdjust();
        i = false;
      }
    } else {
      i = true;
      conField1.fadeOut("slow");
      conField2.fadeOut("slow");
      if (conField1.css('display') == 'block' || conField2.css('display') == 'block') { 
        moreFields.animate({top: "-=" + halfSpace}, 600);
        submitBtn.animate({top: "-=" + halfSpace}, 600);
      }  
    }
  });

  var fieldAdjust = function() {
    moreFields.animate({top: "+=" + halfSpace}, 600);
    submitBtn.animate({top: "+=" + halfSpace}, 600);
  }
</script>