Updating text node using jquery

Question

I have this html:

<span class="msg-container">
  <span class="msg"></span>
  A message here
</span>

I'm wanting to use jQuery to find all the msg-container elements, take the "A message here" text and set the title attribute and remove the "A message here" text node.

So, after executing, my DOM should look like this:

<span class="msg-container" title="A message here">
  <span class="msg"></span>
</span>

How do I achieve this?

Fresheyeball · Accepted Answer · 2012-04-19 22:36:26Z

1

 $('.msg-container').each(function(){
      var that = $(this);
      that.attr('title', that.text());
      var children = that.find('.msg').clone();
      that.html('').append(children);
 });

answered Apr 19, 2012 at 22:36

Fresheyeball

30.1k21 gold badges106 silver badges168 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Craig Shearer Over a year ago

Thanks, that's pretty much what I want :)

Jaime · Accepted Answer · 2012-04-19 22:56:49Z

1

Try

$(function()  {
    $(".msg-container").each(function() {
        var txt = $(this).text();
        var children = $(this).children();
        $(this).attr("title",txt.trim())
            .text("").append(children);
    });
});

edited Apr 19, 2012 at 22:56

answered Apr 19, 2012 at 22:34

Jaime

6,8142 gold badges29 silver badges43 bronze badges

1 Comment

Fresheyeball Over a year ago

.text(''); will wipe out the child span.msg along with anything else in the container

COLD TOLD · Accepted Answer · 2012-04-19 23:10:13Z

1

I think you need to use for-each function

 $(".msg-container").each(function(){
       var child =  $(this).children(".msg").html();
       var text=$(this).html("");
        $(this)attr("title" , text) 
        $(this).append(child);
      });

edited Apr 19, 2012 at 23:10

answered Apr 19, 2012 at 22:32

COLD TOLD

13.6k3 gold badges37 silver badges53 bronze badges

1 Comment

Fresheyeball Over a year ago

This does not remove the text node.

Collectives™ on Stack Overflow

Updating text node using jquery

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related