I created a scholarship donation progress bar that dynamically adjusts its width based on the amount donated. While I used CSS to handle the basic functionality, I am now trying to implement JavaScript for more advanced features. My goal is to calculate an integer value based on different ranges of donation amounts, which will then be used in an equation to determine the pixel width of the progress bar. Here is my current code snippet where I have attempted to achieve this, but it only displays the last calculated number. Any help with refining the logic would be greatly appreciated. Thank you!
<script>
{
var amount = 1163; //example amount
var x = 0;
if (0 < amount < 500) {
x = 0;
} if (500 < amount < 1000) {
x = 1;
} if (1000 < amount < 1500) {
x = 2;
} if (1500 < amount < 2000) {
x = 3;
} if (2000 < amount < 2500) {
x = 4;
} if (2500 < amount < 3000) {
x = 5;
}
document.write(x)
}
</script>