I am new to jQuery and am wondering if there is a better, more efficient way to write the follow code that will show the form field associated with the button and hide the other two form fields when one is clicked:

```
$(document).ready(function() {
var frm = $('form');
var comp = $('form[name="parents"]');
var comt = $('form[name="teachers"]');
var comk = $('form[name="kids"]');
$(frm).hide();
$('button[name="parents"]').click(function(e) {
    $(comp).slideToggle(300);
    $(comt).slideUp(300);
    $(comk).slideUp(300);
    $('footer').css("border-color","#2dff1f");
    e.preventDefault();
});
$('button[name="teachers"]').click(function(e) {
    $(comt).slideToggle(300);
    $(comp).slideUp(300);
    $(comk).slideUp(300);
    $('footer').css("border-color","#23a4f2");
    e.preventDefault();
});
$('button[name="kids"]').click(function(e) {
    $(comk).slideToggle(300);
    $(comt).slideUp(300);
    $(comp).slideUp(300);
    $('footer').css("border-color","#9800ff");
    e.preventDefault();
});
if ($("form:visible").length === 0) {
$('footer').css("border-color","#000");
}
});

```

Also, four lines from the bottom I attempted to set an if statement saying to change the footer border-color if comp, comk, comt are all closed. It just simply turns the border-color black on load and then never does again.

EDIT: here is the html structure - 

```
<button name="parents">Parents</button>
        <form name="parents" action="share.php" method="post">
            <fieldset>
                <span style="white-space:nowrap">
                    <label for="name">Name</label>
                    <input type="text" name="name" id="name" tabindex="1"></input>
                </span>
                <span style="white-space:nowrap">
                <label for="email">Email</label>
                <input type="text" id="email" name="email" tabindex="2" onchange="emailValidation()" class="textInput validateEmail required">
                </span>
                <span style="white-space:nowrap">
                <label for="country">Country</label>
                <select name="country" id="country" tabindex="3">
                    <optgroup label="Select One">
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                    </optgroup>
                </select>
                <!--<label for="country">Country</label>
                <?php require('countries.php'); ?> -->
                </span>
                <span style="white-space:nowrap">
                <label for="zip">Zip Code</label>
                <input type="text" id="zip" name="zip" tabindex="4" class="textInput required" maxlength="5">
                </span>

                <label for="message">Message</label>
                <textarea name="message" id="message" tabindex="5"></textarea>
                <input type="submit" tabindex="6" value="share with us">
            </fieldset>
        </form>

        <button name="teachers">Teachers</button>
        <form name="teachers" action="share.php" method="post">
            <fieldset>
                <span style="white-space:nowrap">
                    <label for="name">Name</label>
                    <input type="text" name="name" id="name" tabindex="1"></input>
                </span>
                <span style="white-space:nowrap">
                <label for="email">Email</label>
                <input type="text" id="email" name="email" tabindex="2" onchange="emailValidation()" class="textInput validateEmail required">
                </span>
                <span style="white-space:nowrap">
                <label for="country">Country</label>
                <select name="country" id="country" tabindex="3">
                    <optgroup label="Select One">
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                    </optgroup>
                </select>
                <!--<label for="country">Country</label>
                <?php require('countries.php'); ?> -->
                </span>
                <span style="white-space:nowrap">
                <label for="zip">Zip Code</label>
                <input type="text" id="zip" name="zip" tabindex="4" class="textInput required" maxlength="5">
                </span>

                <label for="message">Message</label>
                <textarea name="message" id="message" tabindex="5"></textarea>
                <input type="submit" tabindex="6" value="share with us">
            </fieldset>
        </form>

        <button name="kids">Kids</button>
        <form name="kids" action="share.php" method="post">
            <fieldset>
                <span style="white-space:nowrap">
                    <label for="name">Name</label>
                    <input type="text" name="name" id="name" tabindex="1"></input>
                </span>
                <span style="white-space:nowrap">
                <label for="email">Email</label>
                <input type="text" id="email" name="email" tabindex="2" onchange="emailValidation()" class="textInput validateEmail required">
                </span>
                <span style="white-space:nowrap">
                <label for="country">Country</label>
                <select name="country" id="country" tabindex="3">
                    <optgroup label="Select One">
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                        <option>USA</option>
                    </optgroup>
                </select>
                <!--<label for="country">Country</label>
                <?php require('countries.php'); ?> -->
                </span>
                <span style="white-space:nowrap">
                <label for="zip">Zip Code</label>
                <input type="text" id="zip" name="zip" tabindex="4" class="textInput required" maxlength="5">
                </span>

                <label for="message">Message</label>
                <textarea name="message" id="message" tabindex="5"></textarea>
                <input type="submit" tabindex="6" value="share with us">
            </fieldset>
        </form>

```

Thanks for helping me learn more about jQuery!