How to set text of a label control using JQuery

Posted on 2014-07-20
Last Modified: 2014-07-21
I am trying to set the text of a lable control using JQuery. The Label control is an label control.
Can someone look at my two lines of JQuery below, that are not working. I am not sure if the JQuery syntact is correct.

$('#fooLabel').val('Hello World'); // first try Not working

$('fooLabel').val(''Hello World'); // Second tryn Not working

<asp:Label ID="fooLabel" visible="true" runat="server"></asp:Label>
Question by:brgdotnet
    LVL 58

    Accepted Solution

    runat="server" will change the ID of the control
    If the jquery is in the page you can assign the resulting ID in the script
    $('#<%=fooLabel.ClientId%>').text('Hello World');

    Open in new window

    if the jquery is in an external file you will need to add a class to the label that you can reference

    <asp:Label ID="fooLabel" class="fooLabel" visible="true" runat="server"></asp:Label> 
    $('.fooLabel').text(''Hello World');

    Open in new window

    LVL 58

    Expert Comment

    Edited above to set the text not val
    LVL 2

    Author Comment

    Hi Gary,

    Are you saying that if I remove the runat=server that it will fix the problem? Also, the JQuery is in the same page of the Aspx file. Not in an external file.
    LVL 58

    Expert Comment

    If it's in the same page then you can just use the first example
    If you remove the runat="server" then this will work
    $('#fooLabel').text('Hello World');

    This is also assuming the jquery code is in a document ready function or at the end of the page.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Better Security Awareness With Threat Intelligence

    See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

    Problem Hi all,    While many today have fast Internet connection, there are many still who do not, or are connecting through devices with a slower connect, so light web pages and fast load times are still popular.    If your ASP.NET page …
    Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
    The viewer will learn how to dynamically set the form action using jQuery.
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    758 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    14 Experts available now in Live!

    Get 1:1 Help Now