Silverburch
Silverburch

Reputation: 477

Matching a variable with a checkbox label

Hours spent trying to get the correct syntax for this. I want to find the checkbox that has a label matching the variable 'mytext', and then make that checkbox label red. I seem to have tried all combinations of find() and text() but nothing works. Please help. https://jsfiddle.net/n4f50j3m/

<div id="Both_containers">
<div id="Upper_container">
<label><input type="checkbox" value="PP1" />Iron ore</label>
<label><input type="checkbox" value="PP2" />Coal</label>
<label><input type="checkbox" value="PP3" />Flux</label>
</div>
</div>

.

var mytext = "Coal";
$('#Both_containers div label').find(mytext).text().addClass('make_red');

.

.make_red{
 color: red;
}

Upvotes: 0

Views: 71

Answers (1)

Your friend here is :contains().

try with

$('#Both_containers div label:contains(' + mytext + ')').addClass('make_red');

Demo

var mytext = "Coal";
$('#Both_containers div label:contains(' + mytext + ')').addClass('make_red');
.make_red {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="Both_containers">
  <div id="Upper_container">
    <label><input type="checkbox" value="PP1" />Iron ore</label>
    <label><input type="checkbox" value="PP2" />Coal</label>
    <label><input type="checkbox" value="PP3" />Flux</label>
  </div>
</div>

Upvotes: 1

Related Questions