Javascript widget to replace the original price with discounted price

An e-commerce website has a page with multiple products in it. Each product has a price tag below the product image. i have to create a widget which when included finds all these price tags and puts a new price label just below the original price showing the discounted price.

The discount rates are

  1. 20% - if the cost of the item is less than $100.

  2. 30% - $100 <= Cost of the item < $500

  3. 40% - Cost of the item >= $500

  4. The minimum cost of the item to get a discount is $20. If there is no discount, there is no need to show any label below the actual price.

  5. The HTML elements which contain the original price tags have class names in the format “price-”. For example, if product Id is 123, the element which holds the price tag has a class named “price-123”.

i completed the html layout and i am begginer in javascript so kindly help with this question? how can i solve and the algorithm should i follow ?