We Keep Coding

Change label text with jQuery but not other label elements

I have 2 radio buttons and each of them inside a label.
<fieldset>
<label><input type="radio" name="invoice_type" value="Receipt"> Receipt</label>
<label><input type="radio" name="invoice_type" value="Invoice"> Invoice</label>
</fieldset>
I tried to change the label text with jQuery with this code but it replaces entire label content, including the radio boxes.
$('fieldset>label:eq(0)').text('Some text');
$('fieldset>label:eq(1)').text('Some text');
how i can replace only the label text without touching the radio boxes?

You should consider rearranging your HTML.
$('fieldset>label:eq(0)').text('Some teqxt');
$('fieldset>label:eq(1)').text('Some text');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<fieldset>
<label for="label1">Receipt</label>
<input type="radio" id="label1" name="invoice_type" value="Receipt">
<label for="label2">Invoice</label>
<input type="radio" id="label2" name="invoice_type" value="Invoice">
</fieldset>

To make minimal changes to your layout and still not need an id= and related for=:
add a span to wrap your text and target the span
this also has the added bonus of allowing some styling to be added to the span, eg for consistent spacing
label>input+span { margin-left:0.75em; }
without relying on additional spaces in both the original markup and in the replacement text
$("button").click(() => {
$('fieldset>label:eq(0)>span').text('Some text');
$('fieldset>label:eq(1)>span').text('Some other text');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<fieldset>
<label>
<input type="radio" name="invoice_type" value="Receipt">
<span>Receipt</span>
</label>
<label>
<input type="radio" name="invoice_type" value="Invoice">
<span>Invoice</span>
</label>
</fieldset>
<button>click me</button>
Note
https://api.jquery.com/eq-selector/#eq1
As of jQuery 3.4, the :eq pseudo-class is deprecated. Remove it from your selectors and filter the results later using .eq().
left it in above so that it matches OPs code more closest, the alternative would be:
$("fieldset>label").eq(0).find(span)
or target the individual label directly
$("input[value='Receipt']").next()
(based on the current layout)

Using simple vanilla JS this is easy (no clue about jQuery though, stopped using that in 2015), and does not require any changes in the markup:
document.querySelector('fieldset>label').childNodes[1].textContent = ' foo';
document.querySelector('fieldset>label+label').childNodes[1].textContent = ' bar';
<fieldset>
<label><input type="radio" name="invoice_type" value="Receipt"> Receipt</label>
<label><input type="radio" name="invoice_type" value="Invoice"> Invoice</label>
</fieldset>

Here is a solution that does not require to change your HTML and uses jquery:
$('fieldset>label:eq(0)').contents()[1].textContent = 'Some teqxt';
$('fieldset>label:eq(1)').contents()[1].textContent = 'Some text';
If you have multiple tags inside the <label> tag you can use the more correct filtering version:
$('fieldset>label:eq(0)').contents().filter(function () { return this.nodeType === 3; })[0].textContent = 'Some teqxt';
$('fieldset>label:eq(1)').contents().filter(function () { return this.nodeType === 3; })[0].textContent = 'Some text';

How to get the selected radio button label text using jQuery

I have a radio button like this on page
<div id="someId">
<label class="radio-inline">
<input name="x" type="radio" onchange="GetSelectedVal();">Yes</label>
<label class="radio-inline">
<input name="x" type="radio" onchange="GetSelectedVal();">No</label>
</div>
On page load I don't want to set any selection so not using checked property. In my JavaScript function, how can I get the value Yes or No based on the user selection at runtime?
function GetSelectedVal() {
console.log($('#someId input:radio.........);
}
I have seen similar questions but unable to find solution of this issue.

Remove onchange inline handler from HTML. Use on to bind events.
:checked will select the checked radio button. closest will select the parent label and text() will get the label associated with the radio button. e.g. Yes
$('[name="x"]').on('change', function () {
alert($('[name="x"]:checked').closest('label').text());
});
DEMO

You can simple pass this in onchange="GetSelectedVal(); like onchange="GetSelectedVal(this);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="someId">
<label class="radio-inline"><input name="x" type="radio" onchange="GetSelectedVal(this);">Yes</label>
<label class="radio-inline"><input name="x" type="radio" onchange="GetSelectedVal(this);">No</label>
</div>
<script>
function GetSelectedVal(ele) {
alert($(ele).closest('label').text());
}
</script>

I would do it a bit different than the accepted answer.
Instead of having events on multiple radio buttons, you can have one on the containing div. Also let just the checked radio trigger the change:
$('#someId').on('change', 'input[name="x"]:checked', function () {
var label = $(this).siblings('span').text();
console.log(label);
});
When I have text next to other elements I prefer wrapping the text in span's:
<div id="someId">
<label class="radio-inline"><input name="x" type="radio"><span>Yes</span></label>
<label class="radio-inline"><input name="x" type="radio"><span>No</span></label>
</div>
A demo: jsfiddle.net/qcxgwe66/

I want to use the text of radio inputs. How can i get it using jQuery or JavaScript

I want to use the text 5 and 6 shown below. I cant modify the html as it is auto-generated and there are many other radios with the same structure. How can i achieve this using jQuery or JavaScript and store them as variables.
<label class="radio">
<label style="display: none;">
<input type="radio" name="x_keeper1_price" id="x_keeper1_price_0" value="21"/>
</label>
5
</label>
<label class="radio">
<label style="display: none;">
<label style="display: none;">
<input type="radio" name="x_Defd5_price" id="x_Defd5_price_0" value="28"/>
</label>
</label>
6
</label>

If your text after the radio button is html code, this is a better solution:
var text = $("#x_keeper1_price_0") //the radio button
.closest("label.radio") //the label with class=radio)
.html() //the html code
.replace(/<label[\d\D]+<\/label>/, '');
/* Removing the "second" label and its content.
That will get the text after the radio button. */
alert(text);
jsfiddle: http://jsfiddle.net/72KcV/3/

For this specific markup, you can use the following jQuery code:
$('label.radio').each(function(){
console.log($(this).contents()[2].nodeValue)
});
http://jsfiddle.net/eKG22/

You can do the following
$('.radio').text()
see a working solution here: http://jsfiddle.net/TfP5X/
Because we are using a class to select the text, you might want to loop over the selector and do something with each value like so.
var items = $('.radio');
$.each(items, function(i, item) {
var text = $(item).text();
//do something with text
});

Enabling multiple textareas based on radiobutton response

Here is the problem I am trying to solve:
I have a long list of questions.
Each question includes a response section, which consist of 4 radiobuttons (Yes, No, Not Seen and Not Applicable) and two textareas;
Now, textarea "observation" is disabled by default. Only user's response "No" enables this textarea.
Question: How to apply the same logic to every textarea "observation" throughout the entire set of questions.
What I have at the moment is:
A. HTML for Response buttons
<div id="Response">
<label><input type="radio" name="Radio419" value="Y" id="Radio_419Y" onchange='radioChange(this)'>Yes</label>
<label><input type="radio" name="Radio419" value="N" id="Radio_419N" onChange='radioChange(this)'>No</label>
<label><input type="radio" name="Radio419" value="NS" id="Radio_419NS" onChange='radioChange(this)'>Not Seen</label>
<label><input type="radio" name="Radio419" value="NA" id="Radio_419NA" onChange='radioChange(this)'>Not Applicable</label>
</div>
B. HTML for Textboxes
<span id="responseDetails">
<div id="Comment">
<label for="comment">Comment:</label>
<textarea name="comment" id="Comm419"</textarea></div>
<div id="Observation">
<label for="observation">Observation:</label>
<textarea name="observation" id="Obs419"</textarea></div>
</span>
C. JS for processing THIS question only
<script type="text/javascript">
document.radioChange = function (button)
{if(button.checked ) {if (button.value === "N")
{document.getElementById("Obs419").removeAttribute("disabled")}
else
{document.getElementById("Obs419").setAttribute("disabled",true)}}}
</script>
Now as it is apparent I can only apply this to question 419, referring to textbox Observation (Obs419).
How do I apply JS to cover other questions, because textareas are going to be the same throughout the questionnaire. Textarea id changes with every new question (Obs420, Obs421 etc).
Thank you in advance.

If you can pass the id into radioChange() function like this onchange='radioChange(this, '419')'
<label><input type="radio" name="Radio419" value="Y" id="Radio_419Y" onchange='radioChange(this, '419')'>Yes</label>
Then you will get that id of radio button(which would be clicked) inside radioChange() and with that dynamic id you need to just write below code.
document.radioChange = function (button, id)
{if(button.checked ) {if (button.value === "N")
{document.getElementById("Obs"+id).removeAttribute("disabled")}
else
{document.getElementById("Obs"+id).setAttribute("disabled",true)}}}
UPDATE
First of all, your both textarea tags are not closed
<textarea name="comment" id="Comm419" </textarea></div>
//-----------------------------------^
Second you will have to pass id within double quote "", like
onchange='radioChange(this, "419")'
Here is the DEMO with passing dynamic id.

Html Find and hide text

I have some html like this :
<p>a. Is there a skin and/or scar condition?
<br>
<input id="ucWSDBQ_CheckBox3" type="checkbox" name="ucWSDBQ$CheckBox3">
<label for="ucWSDBQ_CheckBox3"></label>Yes
<input id="ucWSDBQ_CheckBox5" type="checkbox" name="ucWSDBQ$CheckBox5">
<label for="ucWSDBQ_CheckBox5"></label>No
<br> If yes, check all that apply and complete the corresponding DBQ(s):
<br>
<input id="ucWSDBQ_CheckBox6" type="checkbox" name="ucWSDBQ$CheckBox6">
<label for="ucWSDBQ_CheckBox6"></label> <b>Skin Diseases DBQ<br> </b>
<input id="ucWSDBQ_CheckBox7" type="checkbox" name="ucWSDBQ$CheckBox7">
<label for="ucWSDBQ_CheckBox7"></label> <b> Scars DBQ</b>
</p>
I want to hide the text If yes, check all that apply and complete the corresponding when user clicks No, and show the text when user clicks Yes. I have tried different things but didn't work.
Fiddle

Look at this fiddle and see if it's what you're after.
$('form').on('click', function() {
if($('#ucWSDBQ_CheckBox3').is(':checked')) {
$('.hidden').css('display', 'block');
} else {
$('.hidden').css('display', 'none');
}
});
I've added a form and a wrapper-div to your HTML.
http://jsfiddle.net/yUu6q/10/

Handle the onClick event of the checkbox. In that you will have to write code for whatever you want to achieve