setting content between div tags using javascript

Question

I m trying to set some content in between some div tags on a JSP page using javascript   currently the div tag on the JSP page looks like this    lt div id  successAndErrorMessages  gt  lt  div gt    I want to fill the content in those div tags using some javascript method so that it will look like so    lt div id  successAndErrorMessages  gt  lt div class  portlet-msg-error  gt This is an error message lt  div gt  lt  div gt    I know you can go like this   document getElementById  successAndErrorMessages   value  someContent     But that just changes the value of the  value  attribute  It doesn t fill in content between those div tags  Anyone out there that can point me in the right direction

User · Answer

If the number of your messages is limited then the following may help. I used jQuery for the following example, but it works with plain js too.

The innerHtml property did not work for me. So I experimented with ...

    <div id=successAndErrorMessages-1>100% OK</div>
    <div id=successAndErrorMessages-2>This is an error mssg!</div>

and toggled one of the two on/off ...

 $("#successAndErrorMessages-1").css('display', 'none')
 $("#successAndErrorMessages-2").css('display', '')

For some reason I had to fiddle around with the ordering before it worked in all types of browsers.

User · Answer

See Creating and modifying HTML at what used to be called the Web Standards Curriculum    Use the createElement  createTextNode and appendChild methods

User · Answer

Try the following   document getElementById  successAndErrorMessages   innerHTML  someContent      msdn link for detail    innerHTML Property

[javascript] setting content between div tags using javascript

Examples related to javascript

Examples related to html