Removing only the outer html element from a HTML code section

Question

I want to remove outer HTML element from a code snippet to get the content inside including other html elements.

that is,

consider the below code

<p> My Paragraph 
   <ul>Mylist
     <li>Item1</li>
     <li>Item2</li>
   </ul>
</p>

I want to get the output displayed as below

My Paragraph 
       <ul>Mylist
           <li>Item1</li>
           <li>Item2</li>
       </ul>

Is this possible ??

Please provide us with some code, and could you clarify what you mean? — Jeffrey, Dec 24 '14 at 07:20
sorry guys, by mistake i saved the code without intending the code. Now i have edited the question. please have a look and provide some solution.. thanks in advance — Monu Thomas, Dec 24 '14 at 07:34

score 1 · Answer 1 · answered Dec 24 '14 at 07:37

1

You need to use .unwrap() along with .contents() to target all the contents in it:

 $('p').contents().unwrap();

answered Dec 24 '14 at 07:37

Milind Anantwar

Helo Milind, i need to get the inner html elements as it is. donot want to remove or apply inner tags. :) could it be possible? Thank you – Monu Thomas Dec 24 '14 at 07:42
@Milin plus one, but his markup is not right may be it will cuase problem – A.B Dec 24 '14 at 07:44
@A.B: indeed. p tags are not suppose to have ul element. here is why http://stackoverflow.com/a/10601411/1719752 – Milind Anantwar Dec 24 '14 at 07:45
@MonuThomas: it does not remove any contents. its just unwrapping the parent. see the demo. – Milind Anantwar Dec 24 '14 at 07:45
ok if so i can change the code to '
My Div
My List
Item1

Item2
' Then I need Output as 'My Div
- Item1
- Item2
'.
– Monu Thomas Dec 24 '14 at 07:53
in that case, you will have to use `$('div').contents().unwrap(); ` – Milind Anantwar Dec 24 '14 at 07:55
@MilindAnantwar: sir, i dont want to get output in formatted form. just display the
- tags inside
  as it is. can we do so ?
– Monu Thomas Dec 24 '14 at 07:56
well it is not clear what are you asking now. are you looking for indented format. – Milind Anantwar Dec 24 '14 at 07:58

score 0 · Answer 2 · answered Dec 24 '14 at 07:43

0

ul elements are not legally allowed inside `p' elements.

you can unwrap() function to do this Refrence

answered Dec 24 '14 at 07:43

A.B

score 0 · Answer 3 · answered Dec 24 '14 at 07:46

0

In your code ul inside p will not work as expected when using

$('p').contents().unwrap();

As suggest by A.B. Use div instead of p, than try

$('div').contents().unwrap();

answered Dec 24 '14 at 07:46

Shyam

3 Answers3