SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Guru
    Join Date
    Mar 2004
    Posts
    639
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Is it possible to change innerHTML of dynamically created DIV?

    Hello guys,

    I wonder is there any way to change innerHTML of DIV, created dynamically with JavaScript?

    If it's possible, how can I do it?

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Use the reference to the div you created and then use innerHTML with it. E.g.:
    Code:
    var div = document.body.appendChild(document.createElement('div'));
    div.innerHTML = '<p>something to go in the div</p>';

  3. #3
    SitePoint Guru
    Join Date
    Mar 2004
    Posts
    639
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Raffles View Post
    Use the reference to the div you created and then use innerHTML with it. E.g.:
    Code:
    var div = document.body.appendChild(document.createElement('div'));
    div.innerHTML = '<p>something to go in the div</p>';
    Thanks Raffles.

    But I use big 3rd party script that creating DIV with document.write. In this case, can I change it's innerHTML?

  4. #4
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Yes, but you will have to access it differently. You will have to navigate the DOM somehow to get at it. The easiest way is if the DIV has an ID, then you can use document.getElementById:
    Code:
    var div = document.getElementById('mydiv');
    div.innerHTML = '<p>something to go in the div</p>';
    Elsewhere:
    Code:
    document.write('<div id="mydiv">...</div>');
    Just don't call it mydiv because that's daft.

  5. #5
    SitePoint Guru
    Join Date
    Mar 2004
    Posts
    639
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    Quote Originally Posted by Raffles View Post
    Yes, but you will have to access it differently. You will have to navigate the DOM somehow to get at it. The easiest way is if the DIV has an ID, then you can use document.getElementById:
    Code:
    var div = document.getElementById('mydiv');
    div.innerHTML = '<p>something to go in the div</p>';
    Elsewhere:
    Code:
    document.write('<div id="mydiv">...</div>');
    Just don't call it mydiv because that's daft.
    I did exactly the same, but it didn't work.

    My code is like this one:
    function show(photo){
    document.getElementById(photo).innerHTML = "some HTML";
    }

    document.write('....<div id=' + photoid + '>Some Text</div>...')
    show('445');

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why use innerHTML when you are outputting the div with document.write? Why not just put the content of the div directly?

  7. #7
    SitePoint Guru
    Join Date
    Mar 2004
    Posts
    639
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pepejeria View Post
    Why use innerHTML when you are outputting the div with document.write? Why not just put the content of the div directly?
    As I said, it's big 3rd party script. I can change it, but it's a LOT of work, because it uses document.write everywhere.

    Is there any other way to fix the problem? If no, I will rewrite it, but I'd really like to save this time.

  8. #8
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This works:
    Code:
    <script>
    function show(photo) {
        document.getElementById(photo).innerHTML = "some HTML";
    }
    
    var photoId = 445;
    
    document.write('....<div id=' + photoId + '>Some Text</div>...')
    show('445'); 
    </script>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •