using jquery in asp.net to hide div tag
- by Eyla
Greetings,
I have asp.net check box     control and asp.net dropdownlist control inside div tag.
I want to hid the div when I check the box and unhide it when I unchecked the box.
I tried few ways with jquery but I could not do it.
Here is my code please look at it and tell me what is wrong with it.
 <%@ Page Language="C#" MasterPageFile="~/Master.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="IMAM_APPLICATION.WebForm1" Title="Untitled Page" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
  <script src="js/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script type="text/javascript">
        function ModifyOccup() {
            $('myOccup').removeClass('display1');
            $('myOccup').removeClass('display1');
            $('myOccup').removeClass('display');
            $('myOccup').removeClass('display');
            if ($('#<%=chkOccup.ClientID %>').is(':checked')) {
                $('myOccup').addClass('display1');
            }
            else {
                $('myOccup').addClass('display');
            }
        }
                </script>
                  <asp:CheckBox ID="chkOccup" runat="server" Style="top: 1055px; left: 355px;
                    position: absolute; height: 22px; width: 126px" Text="Check to modify" onclick=" ModifyOccup()"/>
         <div id ="myOccup" >
                 <asp:DropDownList ID="cmbWorkField" runat="server" Style="top: 1090px; left: 350px;
                    position: absolute; height: 22px; width: 126px">
                </asp:DropDownList>
      </div>
</asp:Content>
......................
Style.css File
..........................
    .display { display: none; }
    .display1 { display: inherit; }