javascript - How do I rename an <li> inside a <ul> using jQuery? -

I need your help.

I did not get much reference material from there (if any) on the web, so I'm turning to help the gurus and experts around this place.

How do I create a listback, such as when an item gets highlighted, and I click on the Rename button at the top, with an existing value of Lee, an input box is placed in the same place The selected light value will be kept and the user will have the option to rename the li item, then the changes are saved if lisbox has lost its focus. Similar examples are windows, when you click on "rename" An input box is created for the user to name the file named Prachi. I want to duplicate the same functionality and apply it to a ul list box.

To keep things simple and straightforward, I'm jQuery friendly.

Here's a fiddle:

HTML:

My solution temporarily takes input and when it is done it A li is converted to $ ('Li.active'). RemoveClass ('active'); $ (This) .addClass ('active'); $ (This) .replaceWith ('& lt; input type = "text" id = "change_me" & gt;'); Var val = $ ('# change_me'). Val (); If (val) {$ ('# change_me'). Replace ('');}});

/ P>

 & gt;');} }, 100);});});