jQuery .text () захватывает текст, который соответствует условию

Question

Когда пользователь запускает действие, h1.text () должен совпадать с h2.text ().

$('h1').text($('h2').text());

Проблема в том, что у h2 есть некоторые пролеты и скрытые пролеты внутри. E.g.:

<h2>Countries: <span class="ec">Ecuador</span> <span class="cl hidden">Chile</span></h2>

h1 должно быть:

Countries: Ecuador

Чили следует исключить, поскольку оно находится внутри пролета со скрытым классом. Я знаю, что это может быть достигнуто с условиями как-то. Есть идеи?

Answer 1

Клон элемент h2 (чтобы мы не испортили оригинал), затем find и удалим все элементы span.hidden,затем вернуть текст обратно (используя end , чтобы вернуться вверх по цепочке jquery из удаленных скрытых пролетов обратно в h2) и применить его к h1:

$('h1').text($('h2').clone().find('span.hidden').remove().end().text())

jsFiddle:http://jsfiddle.net/mhUEr/1/