Countdown Download Timer - Download Button [ Download Timer Start When Click On Download Button ]

     <style>
    /*-- timer download button CSS --*/
    .adscontainer{
    padding: 1%;
    background: #00abff4f;
    border: 1px solid #d5d5d5;
    }
    .timerd2{
    color: blue;
    cursor: pointer;
    }
    #mbtn, #rbtn {
        padding: 10px 20px;
        border: 0;
        border-radius: 5px;
        background: none;
        color: #000;
        float: right;
        text-transform: capitalize;
        font-weight: 700;
        font-size: 12px;
        font-family: 'Droid Sans';
    }
    </style>



<div class="adscontainer" style="margin: 1%;">
<div class="textCenter">
<div class="textTopic" align="center"><b>Download button Countdown timer Script for</b></div>
<div>
<span class="textSize"><b>Click here 👇 to Download </b></span>
<button id="mbtn"><i aria-class="fa fa-cloud-download"></i>
<a href="#" id="timerdwnl">Download Now !</a>
<span id="timrbtn" class="timerd2">Click to Download</span>
</button>
</div>
</div>
<span>
<!--Banner Ad 400 * 60-->
adshere
</span>
</div>

    <script type='text/javascript'>
       //<![CDATA[
       var downloadButton = document.getElementById("timerdwnl");
    var counter = 3;
    var newElement = document.createElement("div");
    newElement.innerHTML = "File is ready to download";
    var id;

    downloadButton.parentNode.replaceChild(newElement, downloadButton);

    function startDownload() {
        this.style.display = 'none';
        id = setInterval(function () {
            counter--;
            if (counter < 0) {
                newElement.parentNode.replaceChild(downloadButton, newElement);
                clearInterval(id);
            } else {
                newElement.innerHTML = +counter.toString() + " second.";
            }
        }, 1000);
    };

    var clickbtn = document.getElementById("timrbtn");
    clickbtn.onclick = startDownload;
    //]]>
        </script>