Build knockout js range slider

Build 3 knockout js sliders which will have 3 category [Amount, Loan ,Rating] .When I change the slider a tooltip at the top should change as well. The rating slider can be from [A to E ] and below that slider the text should change depending on where it is, for example right now in the picture it is C so it has a text below it, and when its A it should have a different text, you can use any random loresem text. It should also have a popover box beside it like the one in the table. In Ratings the percentage should change as well, and all this sliders will effect the table below ! so the numbers on the table will change. I have already created the table and made the html file and CSS and documented it perfectly so your job will be much easier and you only need to add sliders. Keep in mind this whole thing should be done WITH BOOTSTRAP as well. Please see the picture for better understanding. And the file is uploaded as well in which you are going to work with. Should be done in max 1 days.