Need to reduce/simplify this code in jquery

Question

Here I have add asp.net code and Global variables along with jquery condition for elements and this code works fine for me but I want simplify this code. Can anyone help on this?

Asp.net

    <div class="toggle_container">
            <p>
                <asp:HiddenField ID="hdnIsSwipe" runat="server" />
                <asp:Label ID="lblPaymentType" runat="server" Text="<span>*</span> Payment Type"
                    AssociatedControlID="ddlPaymentType"></asp:Label>
                <asp:DropDownList ID="ddlPaymentType" runat="server">
                </asp:DropDownList>
            </p>
            <p>
                <asp:Label ID="lblAccountNumber" runat="server" Text="<span>*</span> Account Number"
                    AssociatedControlID="txtAccountNumber"></asp:Label>
                <asp:TextBox ID="txtAccountNumber" runat="server" MaxLength="17" Style="width: 155px;"></asp:TextBox>
                <asp:HiddenField ID="hdnAccountNo" runat="server" />
                <asp:LinkButton ID="btnSwipe" runat="server" CausesValidation="false" OnClientClick="tb_show('Swipe','#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=false');return false;"
                    Visible="true" Text="Swipe" CssClass="btnSwipe">

                </asp:LinkButton>
                <input id="btnClear" type="button" class="btnClear" name="Click and clear Account Data" />
            </p>
            <p>
                <asp:Label ID="lblAmount" runat="server" Text="<span>*</span> Amount" AssociatedControlID="txtAmount"></asp:Label><asp:TextBox
                    ID="txtAmount" runat="server" MaxLength="8"></asp:TextBox>
            </p>

            <p>
                <asp:Label ID="lblCVV2" runat="server" Text="CVV2" AssociatedControlID="txtCVV2"></asp:Label><asp:TextBox
                    ID="txtCVV2" runat="server" MaxLength="4"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblReferenceNumber" runat="server" Text="Reference Number" AssociatedControlID="txtReferenceNumber"></asp:Label><asp:TextBox
                    ID="txtReferenceNumber" runat="server" MaxLength="50"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblSaleTaxAmount" runat="server" Text="<span>*</span> Sale Tax Amount"
                    AssociatedControlID="txtSaleTaxAmont">
                </asp:Label><asp:TextBox ID="txtSaleTaxAmont" runat="server" MaxLength="10"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblPoNumber" runat="server" Text="<span>*</span> PO Number" AssociatedControlID="txtPoNumber">
                </asp:Label><asp:TextBox ID="txtPoNumber" runat="server" MaxLength="20"></asp:TextBox></p>
            <p>
                <asp:Label ID="lblTaxType" runat="server" Text="<span>*</span> Tax Type" AssociatedControlID="ddlTaxType"></asp:Label>
                <asp:DropDownList ID="ddlTaxType" runat="server">
                </asp:DropDownList>
            </p>
        </div>

Global Variables

    var lblSaleTaxAmount = '#<%=lblSaleTaxAmount.ClientID %>';
    var txtSaleTaxAmont= '#<%=txtSaleTaxAmont.ClientID %>';
    var lblPoNumber = '#<%=lblPoNumber.ClientID %>';
    var txtPoNumber= '#<%=txtPoNumber.ClientID %>';
    var lblTaxType = '#<%=lblTaxType.ClientID %>';
    var ddlTaxType ='#<%=ddlTaxType.ClientID %>';

Jquery Code

    $(ddlPaymentType).change(function(){
        if($(ddlPaymentType).val()=='1' || $(ddlPaymentType).val()=='-1'  )
        {
            $(lblSaleTaxAmount).hide();
            $(txtSaleTaxAmont).hide();
            $(lblPoNumber).hide();
            $(txtPoNumber).hide();
            $(lblTaxType).hide(); 
            $(ddlTaxType).hide(); 

            $("label[for='ContentSection_txtSaleTaxAmont']").hide(); 
            $("label[for='ContentSection_txtPoNumber']").hide();  
        }
        else
        {
            $(lblSaleTaxAmount).show();  
            $(txtSaleTaxAmont).show();
            $(lblPoNumber).show(); 
            $(txtPoNumber).show();
            $(lblTaxType).show(); 
            $(ddlTaxType).show();
        }
    });

Answer 1

If you need to hide label and text always at once, you can add a <div> tag around it and use the div's id to hide both label and text at once

EDIT: Additional information after new comment

You can also add a class to the controls you need to hide at once. Just as example add a class with name hidinggroup. Then in your CSS (assuming you use CSS) create a entry for a second class that is used for hiding, e.g. .hideme { ... }

To hide the items you can do something like

 $('.hidinggroup').addClass('hideme');

And to unhide them you can do

 $('.hidinggroup').removeClass('hideme');

The hideme class must contain the markup for hiding the controls in the way you want... e.g. visibility: hidden; or display: none;

Answer 2

You can just use one hide() function by putting all your selector together separated by a comma:

$(lblSaleTaxAmount, 
  txtSaleTaxAmont, 
  lblPoNumber, 
  txtPoNumber, 
  lblTaxType, 
  ddlTaxType)
.hide();

Or if you put them in parent element such as div#foo, you would simply do:

$('#foo').children().hide();