I have a code to get the value of option element and when a button is clicked, it'll find where that value exist in the page so I can add more things into that table / container.
Somehow if I store the value into a variable, it doesn't work. If I type in the string directly into $("blah:contains('blabhblah')"
it will work. why?
My example here in html
<div class="shipping-time-city">
<label>City: </label>
<select>
<option value='bby'>Burnaby (本拿比)</option>
<option value='van'>Vancouver (温哥华)</option>
<option value='rmd'>Coquitlam (高贵林)</option>
</select>
</div>
other places in the body I have something like
<caption>Coquitlam (高贵林)</caption>
<caption>Burnaby (本拿比)</caption>
<caption>Vancouver (温哥华)</caption>
so in jquery I used click function and this is what I have inside click function
var getCity = $( ".shipping-time-city option:selected" ).text();
($("caption:contains(getCity)").text('bye') //just for testing
the above wouldn't work but if I do it like this
($("caption:contains('Burnaby (本拿比)')").text('bye')
it will work, but I tried console.log(getCity)
which gives me the output of Burnaby (本拿比)
can someone give me a hand on what I am doing wrong here?
Thanks a lot.