How can I change the video Poster using jquery?
<p>I am doing a video list work. In that, there are three links with three different ids. Once the user click on the link, the video and the poster of the video has to change. While I am using my jquery code, the video is changing but the attr "poster" is not change at all ... any reason? This is my code what I am using...</p>

<p>video HTML code :</p>

<pre><code>&lt;video width="600" height="360" id="player2" poster="videos/video1/video1.jpg" controls="controls" preload="none"&gt;
    &lt;!-- MP4 source must come first for iOS --&gt;
    &lt;source type="video/mp4" src="videos/video1/video1.mp4" /&gt;
    &lt;!-- WebM for Firefox 4 and Opera --&gt;
    &lt;source type="video/webm" src="videos/video1/video1.webm" /&gt;
    &lt;!-- OGG for Firefox 3 --&gt;
    &lt;source type="video/ogg" src="videos/video1/video1.ogv" /&gt;
    &lt;!-- Fallback flash player for no-HTML5 browsers with JavaScript turned off --&gt;
    &lt;object width="640" height="360" type="application/x-shockwave-flash" data="videos/flashmediaelement.swf"&gt;
        &lt;param name="movie" value="videos/flashmediaelement.swf" /&gt;
        &lt;param name="flashvars" value="controls=true&amp;amp;file=videos/video1/video1.mp4" /&gt;
        &lt;!-- Image fall back for non-HTML5 browser with JavaScript turned off and no Flash player installed --&gt;
        &lt;img src="videos/video1/video1.jpg" width="640" height="360" alt="Here we are"
            title="No video playback capabilities" /&gt;
    &lt;/object&gt;
&lt;/video&gt;
</code></pre>

<p>My jquery code:</p>

<pre><code>$('div.video-box-area img').click(function(){
    var nowSrc = $('video').attr('src');
    var change = nowSrc.replace(nowSrc.substr(12,1),$(this).parent().attr('id').substr(length-1));

    var poster = $('video').attr("poster");
    var posterChange = poster.replace(poster.substr(12,1),$(this).parent().attr('id').substr(length-1));

    $('video').attr("poster",posterChange);
    $('video').attr('src',change);

    return false;
});
</code></pre>
