Javascript not working in IE

[Wuoshi]

Any reason to why the following code wont work when using IE?


<div id="fields3">Bla bla<input name='frakt' type='radio' class='rad' value='org' onclick="document.getElementById('levvy').innerHTML = '<p>Bla bla</p> <br /> <p>Bla bla</p> <br /> <p>Bla bla</p>'" /></div>

<p class="checkout" id="levvy">Blabla</p>

It works in all other browsers. It also works in IE if I remove the html-tags. Any ideas or alternative solutions?

 

[Bruce_KD]

I would recommend making "levvy" a <div>, or some sort of other element to see if it works that way.
Putting a <p> inside of another <p> is probably too much for IE to handle.


Bruce

 

[Wuoshi]

You dah man!! I should've thought about that!

Repped, thank you!

 

[kceleb9]

You can also try using outerHTML - though that can cause headaches in Firefox.

Honestly though - this form of DOM manipulation is fairly old school - you might want to try using something like jQuery - if you can take the slight overhead - it makes all of these things a snap - and handles the cross browser issues for you...

 

[Wuoshi]

Thanks, will look into it.

 

[obvio]

I second that recommendation to look at jQuery. It makes manipulating html or css very simple and easy to read. It also separates the html from the javascript which makes things so much more readable.

 

[edomainsuk]

Just make it compatible by using innerHTML and outerHTML .. etc

example

if(navigator.appName.indexOf("Mozilla") == -1)
{
 document.getElementById('levvy').innerHTML = "Mozilla content";
} else {
 document.getElementById('levvy').outerHTML = "IE content";
 }

or instead of using div's and <p> with id's just use "document.write();" .. that way it won't be neither of those to outhandle.

Hope it helps.