javascript - changing style based on content -
i have html
<div class="common"> <p class="special"> <p class="child">test1</p> </p> <p class="special"> <p class="child">test2</p> </p></div>
as see have 2 paragraphs same style different content, want change , style of paragraph content contains "test1", wrote this
$(".common").each(function () { if ($(this).find('.special').find('.child').text() == "test1") { $(this).find('.special').find('.child').css('background','red'); }});
but style applied both paragraphs, there solution solve in javascript/jquery
your html invalid - p
element cannot contain p
element
<div class="common"> <div class="special"> <p class="child">test1</p> </div> <div class="special"> <p class="child">test2</p> </div> </div>
then
$(".common .special .child").each(function () { if ($(this).text() == "test1") { $(this).css('background', 'red'); } });
demo: fiddle
you code find first .special .child
elementinside each
.commonand if text matches test case applies styles all
.special .childelements within the
.common`
Comments
Post a Comment