How to calculate the winner and loser when with dice in javascript

I have set up two separate "games" where two dice go at random and it calculates the score for both. What i can't do is show the "winner" and the "loser". So theres player 1 and player 2, and what i want to do is write winner or loser below the player with the highest or lowest score. I tried calculating it myself using javascript but none of the code i find is correct.I have searched everywhere online but nothing seems to be working so i don't know what i am doing wrong also i am sorry for this being so long i am in dire need as everything i am doing isn't working, the code i have here is just the dices and the score but with no "winner" or "looser"

<!DOCTYPE html>
<html>
<head>

</head>
<body>
<div>
    <script> 

    var randomNumber1 = Math.floor (Math.random()*6)+1;
    var randomNumber2 = Math.floor (Math.random()*6)+1;
    var opentag = " <img src = 'die";
    var closetag = ".gif'>";
    var imageTagString1 = opentag + randomNumber1 + closetag;
    var imageTagString2 = Math.floor(Math.random()*6)+1;
    var imageTagString2 = " <img src = \"die" + randomNumber2 + ".gif\">";
    var score = randomNumber1 + randomNumber2;

    document.write ("<p>The Score is : " + score);
    document.write(imageTagString1);
    document.write(imageTagString2);

    </script>
</div>
<div>
    <script> 

    var randomNumberA = Math.floor (Math.random()*6)+1;
    var randomNumberB = Math.floor (Math.random()*6)+1;
    var opentag = " <img src = 'die";
    var closetag = ".gif'>";
    var imageTagString1 = opentag + randomNumberA + closetag;
    var imageTagString2 = Math.floor(Math.random()*6)+1;
    var imageTagString2 = " <img src = \"die" + randomNumberB + ".gif\">";
    var score2 = randomNumberA + randomNumberB;

    document.write ("<p>The Score is : " + score);
    document.write(imageTagString1);
    document.write(imageTagString2);

    </script>
</div>


</body>
</html>

Solution

Assuming you have images die1.gif to die6.gif in the same directory as the html file, the following code should be fine:

<!DOCTYPE html>
<html>
    <body>
    <script type ='text/javascript'> 
        var player1Dice1 = Math.floor (Math.random()*6)+1;
        var player1Dice2 = Math.floor (Math.random()*6)+1;

        var player2Dice1 = Math.floor (Math.random()*6)+1;
        var player2Dice2 = Math.floor (Math.random()*6)+1;

        var scoreP1 = player1Dice1 + player1Dice2;
        var scoreP2 = player2Dice1 + player2Dice2;

        var opentag = " <img src = 'die";
        var closetag = ".gif'>";

        var p1d1 = opentag + player1Dice1 + closetag;
        var p1d2 = opentag + player1Dice2 + closetag;

        var p2d1 = opentag + player2Dice1 + closetag;
        var p2d2 = opentag + player2Dice2 + closetag;




        document.write ("<p>Player 1 score is : " + scoreP1);
        document.write(p1d1);
        document.write(p1d2);
        document.write ("<p>Player 2 score is : " + scoreP2);
        document.write(p2d1);
        document.write(p2d2);
        if (scoreP1 > scoreP2) {
            document.write("<p>Player 1 wins. Player 2 loses.</p>");
        }
        else if (scoreP2 > scoreP1) {
            document.write("<p>Player 2 wins. Player 1 loses.</p>");
        }
        else {
            document.write("<p>Draw.</p>"); 
        }
    </script>
    </body>
</html>

Also, read this.