I want to change 2 text elements of input fields with jQuery 3.1.1. from Yes=> Up, No=>Down, but I got this not working with jQuery or Javascript. I honestly do need help.
<div id="mxui_widget_RadioButtonGroup_351" data-mendix-id="281_14" class="mx-name-radioButtons2 dd" focusindex="0" widgetid="mxui_widget_RadioButtonGroup_351" style="">
<div>
<label class="radio-inline">
<input type="radio" name="1556006129938-1719" value="true">Yes</label>
<label class="radio-inline">
<input type="radio" name="1556006129938-1719" value="false">No</label>
</div>
</div>
I tried several attempts and looked around 30 posts and tried the following but failed:
$('input.radio-inline')[0].html( "Omhoog" );
$( "input:last" ).text( "Omhoog" );
/* $( "label" ).next().html('<input type="radio" value="true">Omlaag</label>') */
/* $( "input[value='true']" ).text( "Hot Fasasauzz" );
$( "input[value='Hot Fuzz']" ).next().text( "Hot Fasasauzz" ); */
This is what I expect at the end:
<div id="mxui_widget_RadioButtonGroup_351" data-mendix-id="281_14" class="mx-name-radioButtons2 dd" focusindex="0" widgetid="mxui_widget_RadioButtonGroup_351" style="">
<div>
<label class="radio-inline">
<input type="radio" name="1556006129938-1719" value="true">Up</label>
<label class="radio-inline">
<input type="radio" name="1556006129938-1719" value="false">Down</label>
</div>
</div>
That's not the text of input, but of label element. You could loop through each of the label with class radio-inline and update the textContent, like:
$('label[class="radio-inline"]').each(function() {
var el = $(this).contents().last()[0],
textContent = el.textContent;
if(textContent === 'Yes') {
el.textContent = 'Up';
}
else if(textContent === 'No') {
el.textContent = 'Down';
}
});