return last 10 days dates in html

I can't find a reliable way to get yesterday's date on my page, I need a list of links that show the last 10 days (only 2 in the example) the problem I am having is that every time the month or the year changes i simply get negative days in that current month and year. i also would not mind adding "Report for" to the beginning of each of the links.
<!DOCTYPE html>
<html>
<body>

<a href="D1.html"><p id="date1"></p></a>
<a href="D2.html"><p id="date2"></p></a>

<script>
n =  new Date();
y = n.getFullYear();
m = n.getMonth() + 1;
d = n.getDate();
document.getElementById("date1").innerHTML = m + "/" + (d -1) + "/" + y;
</script>

<script>
n =  new Date();
y = n.getFullYear();
m = n.getMonth() + 1;
d = n.getDate();
document.getElementById("date2").innerHTML = m + "/" + (d - 2) + "/" + y;
</script>



</body>
</html>

Open in new window

LVL 1
csePixelatedAsked:
Who is Participating?
 
Leonidas DosasCommented:
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<title>HTML, CSS and JavaScript demo</title>
</head>
<body>
<!-- Start your code here -->
  <div id="wrapper"></div>
  <script>
   function formatDate(date){
    var dd = date.getDate();
    var mm = date.getMonth()+1;
    var yyyy = date.getFullYear();
    if(dd<10) {dd='0'+dd;}
    if(mm<10) {mm='0'+mm;}
    date = mm+'/'+dd+'/'+yyyy;
    return date;
 }



function last_10_days () {
    var result = [];
    for (var i=0; i<10; i++) {
        var d = new Date();
        d.setDate(d.getDate() - i);
        result.push( formatDate(d));
    }

    return(result);
 }



for(var i=0;i<9;i++){
  var elm=$('<a href="D'+(i+1)+'.html"><p id="date'+(i+1)+'">'+last_10_days()[i] +'</p></a>');
  $('#wrapper').append(elm);
}
  </script>
 
<!-- End your code here -->
</body>
</html>

Open in new window

0
 
Leonidas DosasCommented:
Check this script.It returns in an array the last 10 days
function formatDate(date){
    var dd = date.getDate();
    var mm = date.getMonth()+1;
    var yyyy = date.getFullYear();
    if(dd<10) {dd='0'+dd;}
    if(mm<10) {mm='0'+mm;}
    date = mm+'/'+dd+'/'+yyyy;
    return date;
 }



function last_10_days () {
    var result = [];
    for (var i=0; i<10; i++) {
        var d = new Date();
        d.setDate(d.getDate() - i);
        result.push( formatDate(d));
    }

    return(result);
 }

console.log(last_10_days());

Open in new window

0
 
csePixelatedAuthor Commented:
So how do I put the results into different links in my html?
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
csePixelatedAuthor Commented:
My apologies each date is going to link to a different html file, otherwise this is great Leonidas Dosas!

<a href="D2.html">04/13/2018</a>

<a href="D3.html">04/12/2018</a>

<a href="D4.html">04/11/2018</a>

<a href="D5.html">04/10/2018</a>

<a href="D6.html">04/09/2018</a>

<a href="D7.html">04/08/2018</a>

<a href="D8.html">04/07/2018</a>

<a href="D9.html">04/06/2018</a>

<a href="D10.html">04/05/2018</a>

Open in new window

0
 
Leonidas DosasCommented:
What exactly do you mean? Do you want to add the value into href attr as additionally string?Something like that:
for(var i=0;i<9;i++){
  var elm=$('<a href="'+last_10_days()[i]+'.html"><p id="date'+(i+1)+'">'+last_10_days()[i] +'</p></a>');
  $('#wrapper').append(elm);
}

Open in new window

0
 
csePixelatedAuthor Commented:
all the dates link to the same html file, Im trying to get each link/date to go to to its own html file.
so yesterday's date links to D2.html the day before that links to D3.html the day before that links to D4.html... etc...
0
 
csePixelatedAuthor Commented:
I did not see the code on your last reply, Instead of [date].html can i just count from 2, like 2.html, 3.thml, 4.html....
0
 
Leonidas DosasCommented:
Of course..set in the href attr in js scipt (i+2) instead of last_10_days etc.....
0
 
csePixelatedAuthor Commented:
Im sorry can you be a little more specific?
the below does not work.

<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<title>HTML, CSS and JavaScript demo</title>
</head>
<body>
<!-- Start your code here -->
  <div id="wrapper"></div>
  <script>
   function formatDate(date){
    var dd = date.getDate();
    var mm = date.getMonth()+1;
    var yyyy = date.getFullYear();
    if(dd<10) {dd='0'+dd;}
    if(mm<10) {mm='0'+mm;}
    date = mm+'/'+dd+'/'+yyyy;
    return date;
 }



function last_10_days () {
    var result = [];
    for (var i=0; i<10; i++) {
        var d = new Date();
        d.setDate(d.getDate() - i);
        result.push( formatDate(d));
    }

    return(result);
 }



for(var i=0;i<9;i++){
  var elm=$('<a href="'(i+2)'.html"><p id="date'+(i+1)+'">'+last_10_days()[i] +'</p></a>');
  $('#wrapper').append(elm);
}
  </script>
 
<!-- End your code here -->
</body>
</html>

Open in new window

0
 
Leonidas DosasCommented:
     href="'+(i+2)+'.html"   

Open in new window

0
 
csePixelatedAuthor Commented:
Works beautifully, thanks Leonidas Dosas.
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<title>HTML, CSS and JavaScript demo</title>
</head>
<body>
<!-- Start your code here -->
  <div id="wrapper"></div>
  <script>
   function formatDate(date){
    var dd = date.getDate();
    var mm = date.getMonth()+1;
    var yyyy = date.getFullYear();
    if(dd<10) {dd='0'+dd;}
    if(mm<10) {mm='0'+mm;}
    date = mm+'/'+dd+'/'+yyyy;
    return date;
 }



function last_10_days () {
    var result = [];
    for (var i=0; i<10; i++) {
        var d = new Date();
        d.setDate(d.getDate() - i);
        result.push( formatDate(d));
    }

    return(result);
 }



for(var i=0;i<9;i++){
  var elm=$('<a href="D'+(i+2)+'.html"><p id="date'+(i+1)+'">'+last_10_days()[i] +'</p></a>');
  $('#wrapper').append(elm);
}
  </script>
 
<!-- End your code here -->
</body>
</html>

Open in new window

0
 
Leonidas DosasCommented:
You welcome
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.