Help w/ a project

Help w/ a project
0

#1

if you look at the code, I am trying to make the <progress> tag increase by 1 each time, but for some reason, I couldn’t get it right and it wouldn’t increase.

my code:

<button class = "btn btn-default" id = "a1">Add</button>
<progress id = "p1" value = "10" max  = "100"></progress>
<script>
  var num1 = $("#p1").val();
$("#a1").on("click",function(){
  num1++;
});</script>```

#2

So you want to increase the value of the progress element’s value attribute by 1 each time the Add button is clicked? If so, then you must first obtain the current value of the progress element’s value attribute and assign it to a variable (i.e. num1) and then increment num1 by 1, and finally assign the new value of num back to the progress element’s value attribute.

In your current solution, you assign num1 the value outside the click event. Do this inside the click event and then after your num1++ line use the val function to assign num1 back to the progress element.


#3

okay, I tried that, but it still wouldn’t work. I was using codepen.


#4

I did this, and it didn’t work:

  num1++;
  var num1 = $("#p1").val();

});```

#5

Why would you increase num1 before you assigning it a value?


#6

oops! I did fixed it, and it is pretty stubborn. it didn’t work.
:frowning:


#7

If you have a codepen, please share the url


#8

here:


#9

Looks like you are successfully incrementing num1. Now you just need to assign num1 back to the value attribute of the progress element using the jquery val method.


#10

that returned an error


#11

Go back to the code you had and then assign num1 back to the progress element using the val method.