title: Auto play video in Modal on click
body: <p>I currently have a video that opens in a modal window on button click.
  How do I make the video autoplay when the modal window opens? </p>
  
  <p>The modal script i'm using is called 'Remodal' found here <a href="http://vodkabears.github.io/remodal/" rel="nofollow">http://vodkabears.github.io/remodal/</a></p>
  
  <p>===================</p>
  
  <h1>FIDDLE</h1>
  
  <h1><a href="https://jsfiddle.net/tsdev/o4ndexuw/1/" rel="nofollow">https://jsfiddle.net/tsdev/o4ndexuw/1/</a></h1>
  
  <p>===================</p>
  
  <p>HTML</p>
  
  <pre><code>    &lt;!-- 
      Button
      ================================================================================== --&gt;
  
      &lt;button class="image-button" onclick="window.location.href='#modal'"&gt;
          &lt;span class="label"&gt;Watch Careers Video&lt;/span&gt;
          &lt;span class="icon flaticon-arrow"&gt;&lt;/span&gt;
      &lt;/button&gt;
  
  
      &lt;!-- 
      Video Modal
      ================================================================================== --&gt;
  
  
      &lt;div class="remodal" data-remodal-id="modal" role="dialog" aria-labelledby="modal1Title" aria-describedby="modal1Desc"&gt;
        &lt;button data-remodal-action="close" class="remodal-close" aria-label="Close"&gt;&lt;/button&gt;
  
          &lt;div class="video-container clearfix"&gt;
  
              &lt;div class="video clearfix"&gt;
                  &lt;embed width="200" height="113" src="https://www.youtube.com/embed/xxxxxx" frameborder="0" allowfullscreen&gt;&lt;/embed&gt;                                
              &lt;/div&gt;
  
          &lt;/div&gt;
  
      &lt;/div&gt;
  </code></pre>
  
  <p>JQUERY</p>
  
  <pre><code>    &lt;script src="&lt;?php bloginfo('template_directory'); ?&gt;/templates/careers/plugins/remodal/remodal.js"&gt;&lt;/script&gt;
  
      &lt;script&gt;
  
        var stopVideo = function ( element ) {
            var iframe = element.querySelector( 'embed');
            var video = element.querySelector( 'video' );
            if ( iframe !== null ) {
                var iframeSrc = iframe.src;
                iframe.src = iframeSrc;
            }
            if ( video !== null ) {
                video.play();
            }
        };
  
  
        $('.remodal-close, .remodal-overlay').click(function(){
          var id = this.id || this.getAttribute( 'data-id' );
          var modal = document.querySelector( id );
          //closePopup();
          stopVideo( modal );
        });
  
  
        //  The second way to initialize:
        /*$('[data-remodal-id=modal2]').remodal({
          modifier: 'with-red-theme'
        });*/
  
      &lt;/script&gt;
  </code></pre>