change div content by clicking an image
<p>I have this div:</p>

<pre><code>&lt;div class="main_mark"&gt;
    &lt;img src="/assets/welcome_main.png" alt="main" class="main_mark_image" /&gt;
&lt;/div&gt;
</code></pre>

<p>I want the next thing: when the user click the image, this div will changed to:</p>

<pre><code>&lt;div class="main_mark"&gt;
    &lt;embed width="420" height="345" src="http://www.youtube.com/v/XjR-4lbK1mI" type="application/x-shockwave-flash"&gt;
    &lt;/embed&gt;
&lt;/div&gt;
</code></pre>

<p>so in my javascript, I have tried to do something like:</p>

<pre><code>$(".main_mark_image").click(function () {
    $("#main_mark").innerHTML = "&lt;embed width=420 height=345 src=http://www.youtube.com/v/XjR-4lbK1mI type=application/x-shockwave-flash&gt;&lt;/embed&gt;";
});
</code></pre>

<p>but it doesn't change anything..</p>

<p>any help aapreciated!</p>
