How to change item text

2 posts, 0 answers
  1. Paul
    Paul avatar
    1 posts
    Member since:
    Sep 2017

    Posted 10 Oct 2017 Link to this post


    If I change the text of a button it removes span and other classes as well.

    This is my code but doesn't work.


                                .Items(items =>
                                    items.Add().Text("Home").Action("Index", "Home").SpriteCssClasses("fa fa-home");
                                    items.Add().Text("About").Action("About", "Home").SpriteCssClasses("fa fa-info");
                                    items.Add().Text("Contact").Action("Contact", "Home").SpriteCssClasses("fa fa-mobile-phone");
                                    items.Add().Text("User").HtmlAttributes(new { id = "userloggedin" }).SpriteCssClasses("fa fa-user").Items(children => {
                                        children.Add().Text("Sign out").SpriteCssClasses("fa fa-sign-out").HtmlAttributes(new { id = "signout" }).Enabled(false);


    <script type="text/javascript">
        function onButtonClick(e) {
                var html = $("#userloggedin").children(".k-link").html();
                $("#userloggedin").children(".k-link").text("It is me!");

                html = $("#userloggedin").children(".k-link").html();



  2. Dimitar
    Dimitar avatar
    778 posts

    Posted 12 Oct 2017 Link to this post

    Hello Paul,

    I would suggest to use the built-in methods of the Kendo UI Menu to achieve the desired result. You can checkout the following API Reference:

    • append() - appends an item to a Menu in the specified referenceItem's sub menu.

    • insertAfter() - inserts an item into a Menu after the specified referenceItem.

    • insertBefore() - inserts an item into a Menu before the specified referenceItem.

    • remove() - removes a specified item(s) from a Menu.

    I am also attaching an ASP.NET MVC solution, where I have used the remove() and append() methods to modify the items of the Menu widget on the click of a button.

    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top