0
Guys, I have the following HTML structure:
<ul id="list_Viagens">
<li class="has-sub">
<a href="#">
<span class="text">Viagem: <span class="destaque">201500124</span> Filial de Origem: <span class="destaque">001 JUNDIAI</span></span>
<span class="holder"></span>
</a>
<ul class="list_Notas">
</ul>
</li>
</ul>
And I want to do it by Jquery using the append
.
Then I develop the following Jquery code:
elementViagem.append(
$('<li>').addClass('has-sub')
.append(
$('<a>').attr('href', '#')
.append(
$('<span>').addClass('text')
.text('Viagem: ')
.append(
$('<span>').addClass('destaque')
.attr('data-element', 'viagem')
.text(val.numvia)
)
.text('Filial da Viagem: ')
.append(
$('<span>').addClass('destaque')
.attr('data-element', 'filori')
.text(val.filori)
),
$('<span>').addClass('holder')
),
$('<ul>').addClass('list_Notas')
)
);
But in this way it is generating the following HTML:
<ul id="list_Viagens">
<li class="has-sub">
<a href="#">
<span class="text">Filial da Viagem: <span class="destaque" data-element="filori">001</span></span>
<span class="holder"></span>
</a>
<ul class="list_Notas"></ul>
</li>
</ul>
Why this part:
<a href="#">
<span class="text">Viagem: <span class="destaque">201500124</span> Filial de Origem: <span class="destaque">001 JUNDIAI</span></span>
<span class="holder"></span>
</a>
Is not correct?