How to add an delay to if/else statement in javascript?

The many ways that I’m trying are not working this is one of them
html

<button type="button" onclick="myFunction()">MY BUTTON</button>
    <div id="love" class="love">
            <div class="boxContainer"></div>
            <div class="boxContainer"></div>
            <div class="boxContainer"></div>
    </div>

css

.love {
    display: none;
}
.boxContainer {
    display: inline-block;
    margin: 15px;
    width: 400px;
    height: 400px;
    border: 1px solid #000;
}

js

function myFunction() {
    var boxContainer = document.getElementById("love");
    if (boxContainer.style.display === "none") {
        boxContainer.style.display = "block";
    }, 1000);
     else {
    boxContainer.style.display = "none";
    }
}

well just want to get the love div after 1 sec when I click the my button

thanks alot very helpful

again thanks alot this is the best help newbies can get…