Why is my && statement not working in this fighting game I made?

I have spent the last 3 hours trying to make this code work. If your HP is at zero, I want an alert to pop up saying "You lose!" If the enemy's HP is zero, alert should say "You win!". If both are at zero, then it should say "It's a draw!".

I've messed around with trying to make the ifs into "!" and have probably switched the order of the if's like 50 times. I once had it completely correct, but that was when I had HP starting at 10 and the random only *3. Once I updated to 100 and *50, the draw started to not work again.

If anyone can help, that would be amazing!!

let yourHp = 100;
let enemyHp = 100;

function attack() {
    let attack = 100;
    //Math.floor(Math.random() * 50);
    let enemyAttack = 50;
    //Math.floor(Math.random() * 50);

    if (!(enemyHp <= 0)) {
        //how much you attack for
        enemyHp -= attack;

        //setting enemy Hp minus how much your attack was
        enemyHpp(enemyHp);

        //setting how much you attacked for
        damage(attack);

        //If both you and the enemy are at 0, it's a draw
    }
    if (!enemyHp >= 0 && !yourHp > 0) {
        enemyHp = 0;
        yourHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert("It's a draw!");
        }, 1);
        document.location.reload();
    } else if (!(enemyHp >= 0)) {
        //If enemy is at 0, you win
        enemyHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert('You win!');
        }, 1);
        document.location.reload();
    }

    //how much enemy attacks for
    yourHp -= enemyAttack;

    //setting your Hp minus how much enemy attack was
    yourHpp(yourHp);

    //setting how much enemy attacked for
    enemyDamage(enemyAttack);

    if (!(yourHp >= 0)) {
        //If only you are at 0, you lose
        yourHp = 0;
        yourHpp(yourHp);
        enemyHpp(enemyHp);
        setTimeout(function() {
            alert('You lose!');
        }, 1);
        document.location.reload();
    }
}

//Making the outputs show in the body
function damage(msg) {
    document.getElementById('damage').innerHTML = msg;
}

function enemyHpp(msg) {
    document.getElementById('enemyHp').innerHTML = msg;
}

function enemyDamage(msg) {
    document.getElementById('enemyDamage').innerHTML = msg;
}

function yourHpp(msg) {
    document.getElementById('yourHp').innerHTML = msg;
}

I switched the code to the following per the answer and the code still shows a draw as "me" winning...

if (enemyHp <= 0 && yourHp <= 0) {
        enemyHp = 0;
        yourHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert("It's a draw!");
        }, 1);
        document.location.reload();
    } else if (enemyHp <= 0) {
        //If enemy is at 0, you win
        enemyHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert('You win!');
        }, 1);
        document.location.reload();
    } else if (yourHp <= 0) {
        //If only you are at 0, you lose
        yourHp = 0;
        yourHpp(yourHp);
        enemyHpp(enemyHp);
        setTimeout(function() {
            alert('You lose!');
        }, 1);
        document.location.reload();
    }