Grow your CSS skills. Land your dream job.

Replace Entire divs with Jvascript

  • # February 27, 2013 at 4:22 pm

    I want to replace an entire div with another using this type of javascript code

    function myFunction()
    {
    x=document.getElementById(‘demo’);
    x.innerHTML=”div replaced”;
    }

    Although im not sure how to do it. Ive done it with text but never with styled divs. It’s to replace the iframe on this website [WEBSITE](http://reallycoolstuff.net/PROJECTS/JV/ “”)

    If there’s an easier, more effective way of doing this im open to suggestions.

    # February 27, 2013 at 5:02 pm

    When you say replace…how will this happen?

    On a click or something else?

    Are you replacing one iframe with another?

    If JS were turned off…would you want the new content to show anyway?

    # February 27, 2013 at 5:11 pm

    @Paulie_D I’m simply replacing a div depending on the navigation bar that is clicked. I’m not replacing iframes. You can see the text inside the ribbon change when a navigation tab is clicked. Thats basically what i want to do but with divs instead. And it will happen on onclick=”myFunction()”

    # February 27, 2013 at 6:49 pm

    Not sure what you want but you can use html in the string you set `innerHTML` to, and style that html however you want.

    # February 27, 2013 at 7:59 pm

    @Jarolin After looking at your site, I noticed that you are using a separate JS function to update the ribbon for every button in the navigation bar. This is highly inefficient and it can be done with one function/event in JS. I whipped up a pen for you: http://codepen.io/srig99/pen/GkJBc. Tell us if you need more help!

    # February 27, 2013 at 8:44 pm

    @srig Thanks. i Knew there was an easier way but i’m still learning Javascript. Are there any other problems you see with my code?

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".