CODEWITHSUNDEEP
javascriptjquery
Matheau Harrison
Matheau Harrison

Reputation: 11

How to Increment a number in JS or jQuery?

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();

Upvotes: 0

Views: 765

Answers (4)

angelos_lex
angelos_lex

Reputation: 1661

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);

Upvotes: 0

ibrahim mahrir
ibrahim mahrir

Reputation: 31712

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);
        });
    }
}

Upvotes: 0

Arsh Kalsi
Arsh Kalsi

Reputation: 179

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>

Upvotes: 0

Mohan P
Mohan P

Reputation: 422

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.

Upvotes: 1

Related Questions