Hey guys,

I've been tearing my hair out for some time trying to figure out why my jquery has suddenly stopped working. The
jquery script that I have written is fairly simple:

$(document).ready(function () {
    $("#pTab").addClass("active");

    $("#pBtn").click(function () {
        $("#pTab").addClass("active");
        $("#gTab").removeClass("active");
    });

    $("#gBtn").click(function () {
        $("#gTab").addClass("active");
        $("#pTab").removeClass("active");
    });
});

I reference this file as such:

<%@ Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="project.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script type="text/javascript" src="Scripts/CustomScripts/Default.js"></script>
    <title> Home </title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="body" runat="server">
    <div class="containerCustom">
        <ul class="navCustom nav-tabsCustom">
            <li id="pTab" runat="server">
                <a id="pBtn" runat="server" href="#">Tab 1</a>
            </li>
            <li id="gTab" runat="server">
                <a id="gBtn" runat="server" href="#">Tab 2</a>
            </li>
        </ul>
    </div>
</asp:Content>

There are no errors when parsing firebug and the thing that really throws me off is that I have jquery working fine on a different page for the same project. I've doubled checked my file path for the js file and double checked the id's. I have no idea what else it could be, if you could help it would be much appreciated. Thank you for your time and help regarding this matter.

IIRC: Check out the source of the page after it's generated. You'll see that the ID's have changed values.

On ASP.NET controls, if you do not want for ASP.NET to generate unique control IDs, you can set the attribute on your web controls: ClientIdMode=Static

I am aware that .NET generates GUID's for controls, doing something like "input[id$='pBtn']" still doesn't generate desired results. Any other suggestions guys? I'm totally stumped.

The simple work-around (even though JorgeM's solution is correct), use class instead of id.

Thank you guys, I found the problem. I had to remove the runat=server attributes on the non-asp controls and everything works now! Thank you so much.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.