title: Change multiple html5 video player speed
body: <p>I have a page with few HTML5 video players, and i want to play all of them in 0.5x speed. I have shown js snippet that runs for single video player only.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    /* play video twice as fast */
    document.querySelector('video').defaultPlaybackRate = 1.0;
    document.querySelector('video').play();
  
    /* now play three times as fast just for the heck of it */
    document.querySelector('video').playbackRate = 3.0;
  &lt;/script&gt;
  </code></pre>
  
  <p>This works for first video only. I need it for every video. Below is a snippet of a part of html.</p>
  
  <pre><code>&lt;ul class="regular slider"&gt;
      &lt;li class="videodiv" style="background-image: url('boxing.jpg')"&gt;
        &lt;video preload="yes" loop&gt;
          &lt;source src="12950321.mp4" type="video/mp4"/&gt;
        &lt;/video&gt;
        &lt;div class="slantedcaption"&gt;Boxing&lt;/div&gt;
        &lt;a href="detail.html"&gt;
          &lt;div class="caption"&gt;
            &lt;h2&gt;Boxing&lt;/h2&gt;
            &lt;div class="category"&gt;Passion&lt;/div&gt;
          &lt;/div&gt;
        &lt;/a&gt;
      &lt;/li&gt;
      &lt;li class="videodiv" style="background-image: url('coding.jpg')"&gt;
        &lt;video preload="yes" loop&gt;
          &lt;source src="14019065.mp4" type="video/mp4"/&gt;
        &lt;/video&gt;
        &lt;div class="slantedcaption"&gt;Boxing&lt;/div&gt;
        &lt;a href="detail.html"&gt;
          &lt;div class="caption"&gt;
            &lt;h2&gt;Boxing&lt;/h2&gt;
            &lt;div class="category"&gt;Passion&lt;/div&gt;
          &lt;/div&gt;
        &lt;/a&gt;
      &lt;/li&gt;
      &lt;li class="videodiv" style="background-image: url('dance.jpg')"&gt;
        &lt;video preload="yes" loop&gt;
          &lt;source src="12950321.mp4" type="video/mp4"/&gt;
        &lt;/video&gt;
        &lt;div class="slantedcaption"&gt;Boxing&lt;/div&gt;
        &lt;a href="detail.html"&gt;
          &lt;div class="caption"&gt;
            &lt;h2&gt;Boxing&lt;/h2&gt;
            &lt;div class="category"&gt;Passion&lt;/div&gt;
          &lt;/div&gt;
        &lt;/a&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>