My custom HTML5 video play is almost complete, I'm just having a slight issue with the Stop button which essentially is a pause button that just resets the video to the beginning.

Below is my code (albeit a little messy);

<script type=text/javascript>

    function stopPlayer() {

        var mediaPlayer;



        mediaPlayer = document.getElementById('media-video');

        mediaPlayer.controls = false;   



        mediaPlayer.pause();

        mediaPlayer.currentTime = 0;



        if ( mediaPlayer.pause == true ) {

            $('.pause-btn').hide();

            $('.play-btn').show();

        }



    }



    function playPlayer() {

        var mediaPlayer;



        mediaPlayer = document.getElementById('media-video');

        mediaPlayer.controls = false;   



        mediaPlayer.play();

    }



    function playPause() {

        var mediaPlayer = document.getElementById('media-video');

        if (mediaPlayer.paused) {

            mediaPlayer.play(); 

            $('.pause-btn').show();

            $('.play-btn').hide();

        } else {

            mediaPlayer.pause(); 

            $('.play-btn').show();

            $('.pause-btn').hide();

        }



    }



</script>

The code in question is inside the stopPlayer(); function -

if ( mediaPlayer.pause == true ) {

            $('.pause-btn').hide();

            $('.play-btn').show();

        }

What I'm trying to do is check to see if the video is Stopped with the StopPlayer function and then hide the pause button and show the play button. As these need to be reset when the the video is stopped.

Currently if you press the stop button, the pause button is still there.

Any advice would be great :)

Edit: Fixed @MelanciaUK suggested I removed the == true on the if statement, which fixed my issue. Thanks!