title: Media error: Format(s) not supported or source(s)
body: <p>I am using <a href="https://www.mediaelementjs.com/" rel="nofollow noreferrer">media player js</a> for my video, I am trying to play hls and dash video format in both ios and android.
  Here is what I have so far.</p>
  
  <p>Live demo code pen: <a href="https://codepen.io/makumba/pen/JjYLvVe" rel="nofollow noreferrer">live demo</a> </p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="video"&gt;
     &lt;video id="player1" muted autoplay controls preload="none"&gt;
  </code></pre>
  
  <p>data - quality = "SD" >
         
      </p>
  
  <p>Here is JS</p>
  
  <pre><code>$('video').mediaelementplayer({
      features: ['playpause', 'current', 'progress', 'duration', 'volume', 'fullscreen', 'quality'],
      stretching: "responsive",
      enableAutosize: false,
      startVolume: 0.5,
      success: function(mediaElement, domObject) {
          mediaElement.setVolume(0.5);
          console.log(mediaElement);
      }
  });
  </code></pre>
  
  <p>Now when I check on a mobile device <strong>(ANDROID)</strong> I get the following error:</p>
  
  <pre><code>Media error: Format(s) not supported or source(s) not found
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/MuS5b.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/MuS5b.png" alt="enter image description here"></a></p>
  
  <p>**</p>
  
  <blockquote>
    <p>NOTE: on iPhone, everything is okay problem is with an android device</p>
  </blockquote>
  
  <p>**</p>
  
  <p>What do I need to do to solve this problem? any help or suggestions will be appreciated</p>