jQuery show and hide function along with MultiView and jQuery Cookie

Question

I am using the jQuery show and hide functions to present additional form information. I am also using MultiView to switch between multiple pages of the form. I have been reviewing a little about jQuery Cookie but not real sure how to implement the code.

I have the show and hide function working properly, I just need to figure out how to implement Cookies. -Thanks

jQuery Script:

<script type="text/javascript">
    $(function () {
        $('.thirdPartyForm').hide();
        $('#thirdPartyService').click(function () {
            if ($(this).is(':checked')) {
                $(".thirdPartyForm").show();
            } else {
                $(".thirdPartyForm").hide();
            }
        });
        $('.emsSection').hide();
        $('#emsYES').click(function () {
            $('.emsSection').show();
            $.cookie('.emsSection');
        });
        $('#emsNO').click(function () {
            $('.emsSection').hide();
        });
    });
</script>

HTML (CheckBoxes)

<!-- CUSTOMER OPTIONS TABLE -->
                        <table id="customerOptionsTable">
                            <tr>
                                <td colspan="4"><p>Customer Options</p></td>
                            </tr>
                            <tr>
                                <td class="cotTd">HVAC Service</td>
                                <td class="chkbx"><asp:CheckBox ID="hvacService" runat="server" /></td>
                                <td class="cotTd">Third Party Site</td>
                                <td class="chkbx"><asp:CheckBox ID="thirdPartyService" runat="server" /></td>
                            </tr>
                            <tr>
                                <td colspan="4"><!-- SPACER --></td>
                            </tr>
                        </table>

HTML (Portion of form that will will show or hide depending on the check)

<tr>
                    <td class="thirdPartyForm">
                        Third Party Name (Website Name):
                        <asp:TextBox ID="thirdPartyName" CssClass="txtbx" runat="server"></asp:TextBox>
                        Phone Number:
                        <asp:TextBox ID="thirdPartyNumber" CssClass="txtbx phoneMask" runat="server"></asp:TextBox>
                        IVR Phone Number:
                        <asp:TextBox ID="thirdPartyIVR" CssClass="txtbx" runat="server"></asp:TextBox>
                        User Name:
                        <asp:TextBox ID="thirdPartyUserName" CssClass="txtbx" runat="server"></asp:TextBox>
                    </td>
                    <td class="thirdPartyForm">
                        Third Party Site Address:
                        <asp:TextBox ID="thirdPartyAddy" CssClass="txtbx" runat="server"></asp:TextBox>
                        Secondary Phone Number (if applicable):
                        <asp:TextBox ID="thirdPartySecondPhone" CssClass="txtbx phoneMask" runat="server"></asp:TextBox>
                        PIN Number:
                        <asp:TextBox ID="thirdPartyPIN" CssClass="txtbx" runat="server"></asp:TextBox>
                        Password:
                        <asp:TextBox ID="thridPartyPassword" CssClass="txtbx" runat="server"></asp:TextBox>
                    </td>
                </tr>

Answer 1

well, after reviewing a few other postings, I created the following:

$(document).ready(function () {

        $('.thirdPartyForm').hide();

        if ($.cookie('showhide') == 'showtp') {
            $('.thirdPartyForm').show();
        }

        $('#thirdPartyService').click(function () {
            if ($(this).is(':checked')) {
                $(".thirdPartyForm").show();
                $.cookie('showhide', 'showtp');
            }
            else {
                $(".thirdPartyForm").hide();
                $.cookie('showhide', null);
            };
        });
    });