How to Increment a number in JS or jQuery?

Question

I need to increment a few different numbers in the same HTML ID every 24 hours. So if one number is at 1 and the other is at 20 regardless of what the number it is must be incremented by 1.

As you can see I just need a way to increment any number in the HTML ID by +1 instead of changing the number to 1. Here is my code

<p id="pColor">
    Flower are on day <span>(<span id="datePlus">1</span>)</span>
</p>
<p id="pColor">
    Fruiting Plants are on day <span>(<span id="datePlus">20</span>)</span>
</p>

JS

function theDate() {
    var initialDate = new Date(2017, 0, 19); // Dec 1st 2012
    var now = Date.now();
    var difference = now - initialDate;
    var millisecondsPerDay = 24 * 60 * 60 * 1000;
    var daysSince = Math.floor(difference / millisecondsPerDay);
    console.log(daysSince);
    function dateUpdate() {
        if(daysSince >=1) {
            console.log("True");

            // THIS IS WHERE I WANT CODE TO GO

        } else {
            console.log("false");
        }
    }
}

theDate();

Identifiers must be unique You are using id="pColor" multiple times — Satpal
– Satpal, Commented Jan 20, 2017 at 6:51
@Satpal said correct <span id="datePlus">20</span> first make datePlus unique. Either use this as a class name. — Sorangwala Abbasali
– Sorangwala Abbasali, Commented Jan 20, 2017 at 6:53
Not sure what exactly you want to increment but you casn do so by just using ++. Example: var number = 0; number++; — Gezzasa
– Gezzasa, Commented Jan 20, 2017 at 6:54

Mohan P · Accepted Answer · 2017-01-20 06:56:05Z

1

Firstly you need class, Not id.

In a html page id can't be duplicate.

And increase the value of every elements using class.

// The .each() method is unnecessary here:
$( ".datePlus" ).each(function() {
  $( this ).html( parseInt($( this ).html()) + 1);
});

When this code will run, it will increase value by one in every element.

answered Jan 20, 2017 at 6:56

Mohan P

4223 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Arsh Kalsi · Accepted Answer · 2017-01-20 07:03:02Z

0

You can add +1 with this for loop of jquery

for(var i = 1;i<7;i++)
{
  $("#demo").append(i+"</br>");//just for testing
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id="demo"></p>

answered Jan 20, 2017 at 7:03

Arsh Kalsi

1791 silver badge10 bronze badges

Comments

ibrahim mahrir · Accepted Answer · 2017-01-20 07:04:00Z

0

First, change id="datePlus" to class="datePlus".

Then use this function:

function theDate() {
    var initialDate = new Date(2017, 0, 19);
    var now = Date.now();
    var difference = now - initialDate;
    var millisecondsPerDay = 24 * 60 * 60 * 1000;
    var daysSince = Math.floor(difference / millisecondsPerDay);

    if(daysSince > 0) {
        $(".datePlus").each(function(){
            var $this = $(this);
            var number = parseInt($this.text());
            number = isNaN(number)? daysSince: number + daysSince;
            $this.text(number);
        });
    }
}

answered Jan 20, 2017 at 7:04

ibrahim mahrir

31.8k5 gold badges50 silver badges78 bronze badges

1 Comment

Matheau Harrison Over a year ago

Thanks, the .each param would have made sense. Very helpful.

angelos_lex · Accepted Answer · 2017-01-20 07:23:45Z

0

First, change the id pColor at one of your

elements, as ID must be unique identifiers. for example:

<p id="datePlus">Flower are on day <span >(<span id="datePlus">1</span>)     </span></p>
  <p id="datePlus">Fruiting Plants are on day <span >(<span id="datePlus2">20</span>)</span></p>

then, you can take the specified elements:

 var number1 = $( "span#datePlus" ).text();
 number1 = parseInt(number1);
 var number2 = $("span#datePlus2").text();
 number2 = parseInt(number2);
 number1++;
 number2++;
 $("span#datePlus").text(number1);
 $("span#datePlus2").text(number2);

edited Jan 20, 2017 at 7:23

answered Jan 20, 2017 at 7:07

angelos_lex

1,6711 gold badge18 silver badges24 bronze badges

Collectives™ on Stack Overflow

How to Increment a number in JS or jQuery?

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related