JSFiddle - React, Tailwind, and code Playground
HTML
<input id="radio-1" type="radio" name="rmr" value="1">
<label for="radio-1">£3</label> <input id="radio-2" type="radio" name="rmr" value="2">
<label for="radio-2">£5.5</label>
<input id="radio-3" type="radio" name="rmr" value="4">
<label for="radio-3">£10</label>
<div class="total-text" style="font-size:36px">£10</div>
JavaScript
$().ready(function(){
var total = parseInt($("div.total-text").text().substring(1), 10);
$("input[name='rmr']").bind('change', function() {
var amount = 0;
switch (this.value) {
case "1":
amount = 3;
break;
case "2":
amount = 5.5;
break;
case "4":
amount = 10;
break;
}
$("div.total-text").text("£" + (total + amount));
});
});