title: Add and remove active class on elements on a page based on radio buttons being checked
body: <p>I have 3 radio buttons, I want each checked function to apply an active class to a certain element on a page which will control the content being 'active'. </p>
  
  <p>I have managed to get the active class working on one radio, but I'm having trouble removing the class when unchecked and writing the code for the other two radio buttons in an efficient way as my JS knowledge is basic af. </p>
  
  <p>Here's what I have for the one working addClass:</p>
  
  <pre><code>$("input#Beach").click(function () {
       if ($(this).is(":checked")) {
           $("#formBeach").addClass("active");
       }
  });
  </code></pre>
  
  <p>So again, how do I remove this class when unchecked? and include the other two radio's to do the same thing. </p>
  
  <p>Update: here's the radio html</p>
  
  <pre><code>&lt;ul class="form-group mb-0"&gt;
      &lt;label&gt;Choose your holiday: &lt;/label&gt;
      &lt;li&gt;
          &lt;input type="radio" id="Tour" name="holiday" checked&gt;
          &lt;label for="Tour"&gt;Tour&lt;/label&gt;
      &lt;/li&gt;
      &lt;li&gt;
          &lt;input type="radio" id="Cruise" name="holiday"&gt;
          &lt;label for="Cruise"&gt;Cruise&lt;/label&gt;
     &lt;/li&gt;
     &lt;li&gt;
          &lt;input type="radio" id="Beach" name="holiday"&gt;
          &lt;label for="Beach"&gt;Beach&lt;/label&gt;
     &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Just to clarify, each radio controls a form, only one form can be 'active' at one time, therefore i need the 'unchecked' radio buttons to remove the active classes from their targeted elements. </p>