Change text within a dynamically generated <span> element without destroying the nested element

Asked

Viewed 2,073 times

0

My need at first seems basic, but I can’t find a way to change the text within a tag <span> that is dynamically generated.

Below follows the excerpt from DOM in which I have the following excerpt: <span>Novo Teste</span>. I need to simply change the text contained within the tag, but without destroying the nested elements.

<li id="0"><span>Novo Teste</span><span class="acoes"> <a href="#" type="reset" class="btn btn-success edit-item" style="position: relative; top: -1px;"> <span class="entypo-pencil"> </span>&nbsp;&nbsp;Editar </a>
    <a id="$('#destination-service-dropdown option:selected').text()" href="#" type="reset" class="btn btn-danger del-item" style="position: relative; top: -1px;"> <span class="entypo-cancel-squared"></span>&nbsp;&nbsp;Cancelar</a>
    </span>
</li>

An unsuccessful attempt was this:

$("#"+idOfListItems+"").next().text($('#destination-service-dropdown option:selected').text());
  • 1

    Forehead . find('span') instead of . next()

  • Sergio, I changed it to the following $("#"+idOfListItems+"").find('span').text($('#destination-service-dropdown option:selected').text());, but unfortunately it didn’t work. It changed the text of the two *span’s and removed my buttons.

1 answer

1


I’d settle it this way:

var contSpan = $('li#'+idOfListItems).find('span');
$(contSpan[0]).html($('#destination-service-dropdown option:selected').text());

I tested it here and it worked.

  • Perfect Yuri! Worked right.

  • If you want to improve the code, I was taking a look here. $('li#'+idOfListItems).find('span').eq(0).html($('#destination-service-dropdown option:selected').text());

Browser other questions tagged

You are not signed in. Login or sign up in order to post.