javascript - Replace div with another div when clicked -

Now what I want, it's #youtube to show all the time, but if you click on it, then I It # Embeds It can not be found to work and what does it mean that I do not do what I explained. Nothing happens

  & lt; Div id = "youtube" onclick = "replace ()" style = "display: block" & gt; & Lt; Img src = "http://img.youtube.com/vi/'.$id.'/1.jpg" & gt; & Lt; Span class = "title" & gt; & Lt; Font color = "# 999" & gt; YouTube and Business; Video: & lt; / Font & gt; '. $ Heading. ' & Lt; / Span & gt; & Lt; Span class = "views" & gt; View: '.number_format ($ view).' & Lt; / Span & gt; & Lt; Span class = "description" & gt; '. $ Desc. ' & Lt; / Span & gt; & Lt; / Div & gt; // Show it only when they clicked on #youtube; & Lt; Div id = "embed" onclick = "replace ()" style = "display: none" & gt; & Lt; Object width = "425" height = "344" & gt; & Lt; Param name = "movie" value = "http://www.youtube.com/v/$1?fs=1" & lt; / Param & gt; & Lt; Param name = "allowFullScreen" value = "true" & gt; & Lt; / Param & gt; & Lt; Param name = "allowScriptAccess" value = "always" & gt; & Lt; / Param & gt; & Lt; Allow "Allow" = "http://www.youtube.com/v/$1?fs=1" type = "app / x-shock-web-flash" permission = "always" Allow FullScreen = "true" width = " 425 "height =" 344 "& gt; & Lt; / Embed & gt; & Lt; / Object & gt; & Lt; / Div & gt;   
 js:  
 replace the  function () {document.getElementById (youtube) .style.display = "none"; Document.getElementById (embedded) .style.display = "block"; } 
    
 
 
 you 
 getElementById :  
  Replace Function () {document.getElementById ("youtube"). Style.display = "none"; . Document.getElementById ("embedded") style.display = "block"; }   
  getElementById  accepts a string, embed is an identifier name, you need to wrap it with ticks and use a string literally.