Jquery inserting html string instead DOM nodes

Question

I have some nested lists and I want to be able to insert a previous level element:

<ul>
<li>Item 1
<ul>
<li class="selecteditem">Item 1.1</li>
<li>Item 1.2</li>
<li>Item 1.3</li>
</ul>
</li>
<li>Item 2</li>
</ul>
<!-- language: lang-js -->
//I try to do it as follows:
$('li.selecteditem').after('</ul></li><ul>"...

But the after() method only allows to insert DOM nodes, so all the closed tags "" are ignored. Is there a way to inject this html string literally exactly where I want it?

Thanks in advance for your help

I don't understand your question, can you paste how do you want your html result? — Jepser Bernardino
– Jepser Bernardino, Commented Nov 16, 2012 at 20:04

Eduardo Quintana · Accepted Answer · 2012-11-16 20:13:45Z

1

Are you looking for something like this?

$('.selecteditem').append('<li>Item 1.4</li>');

If you use .append() you insert html to a certain element keeping the html inside it.

Example Fiddle

answered Nov 16, 2012 at 20:13

Eduardo Quintana

2,3881 gold badge16 silver badges20 bronze badges

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

Comments

user1726343 · Accepted Answer · 2012-11-16 20:09:19Z

0

I see what you need now, but DOM manipulation can only occur given DOM nodes, or valid markup that can be converted to DOM nodes. What you can do is something like this, although this is a pretty hacky solution:

var html = $('ul').html().replace('<li class="selecteditem">Item 1.1</li>','<li class="selecteditem">Item 1.1</li></ul></li><ul>...');
$('ul').html(html);

answered Nov 16, 2012 at 20:09

user1726343

1 Comment

user997593 Over a year ago

Yeah, been thinking about this myself too, that's pretty hacky, but if this is all we have, then it is not that hacky but the right answer...

Collectives™ on Stack Overflow

Jquery inserting html string instead DOM nodes

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related