How do I separate code for more than one conditional logic question?

Site URL: https://evolutionboulders.com/careers

Hi everyone,

I have an application form I'm trying to streamline, as a few questions work best as conditional ones. I was able to get it working for one question, but I can't figure out how to create separate conditional questions (I'm flying by the seat of my pants and any online tutorials I can find, I am 100% not a web developer). I was able to get as far as hiding all the responses I wanted, but answering any trigger question just triggered ALL the conditional questions to activate. How do I separate the code to make sure each conditional question only triggers a unique set?  I know there are lots of sites that build a form for you, but we're trying to keep costs down as much as possible and don't want to take on extra monthly fees if we can help it.

Here's the code I have for hiding the "Additional Employment" questions unless you click "yes" to the conditional question. 

Thanks in advance you smart cookies!

Quote

<style>

  #text-b8354b66-fc7a-45a2-bf38-113427922284,

  #address-ff7ea4e9-a7ec-46e3-8508-c2eef31c5288,

  #textarea-e5bd6ba6-2619-4581-b16c-303f01c73ba9,

  #textarea-56bc3a7b-8525-4c3d-86ec-b22f2c27d6c4,

  #date-8d625645-5b78-469c-bb2c-0c4668e5a0d9,

  #date-a3739475-f31c-4075-9f5c-0ca1c7c089f7,

  #name-602c7be8-7429-4c01-b291-30bb40de546b,

  #text-f6370dfa-c787-41f4-b3ae-a040ffd9f5a9,

  #phone-129f7e66-42d4-403b-be07-4f1ee2851176,

  #text-69591154-4d02-4110-82c3-bfa95445d10b,

  #radio-791b4b8f-3081-4fe0-b619-158196df3d51

 {

    display: none;

}

</style>

<script

src="https://code.jquery.com/jquery-3.6.0.min.js"

  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="

  crossorigin="anonymous"></script>

 

<script>

 $('#radio-18e4296e-e13a-457b-8932-228a675d468b input').click(function(){

    selection = $(this).val();

  

   if (selection == 'Yes') {

     $('.form-item').show()

   }

  });

</script>

Hello! It looks like this line "  $('.form-item').show()" is actually showing all form items, when what you want to do is only show a select few (the ones that are hidden with CSS initially). You should modify this line to show those items only, and you should also add an else statement for if the no option is selected where you will hide those same items. Does that make sense?