1

Eu tenho a seguinte estrutura:

<div class="chosen-container chosen-container-multi" style="width: 300px;" title="" id="Promocoes_chosen">
    <ul class="chosen-choices">

        <li class="search-field">
            <input type="text" value="Selecione" class="" autocomplete="off" style="width: 25px;">
        </li>
    </ul>
    <div class="chosen-drop">
        <ul class="chosen-results">
            <li class="" data-option-array-index="0">1 MÊS GRÁTIS</li>
            <li class="active-result" data-option-array-index="1">50% ESTUDANTES</li>
            <li class="active-result" data-option-array-index="2">2 + 1</li>
            <li class="active-result" data-option-array-index="3">SUPER PROGRESS - CURSOS A DISTÂNCIA</li>
            <li class="active-result" data-option-array-index="4">CURSOS GRATUITOS</li>
            <li class="active-result" data-option-array-index="5">SUPER PROGRESS - CURSOS E FORMULÁRIOS</li>
            <li class="active-result" data-option-array-index="6">TABELA PROGRESSIVA DE LIVROS</li>
            <li class="active-result" data-option-array-index="7">50% OFF - AMIGO PAGA MEIA</li>
            <li class="active-result" data-option-array-index="8">50% FIDELIDADE</li>
            <li class="active-result" data-option-array-index="9">CLIENT PLATINUM - Cursos Gratuitos</li>
            <li class="active-result" data-option-array-index="10">Formulário Grátis</li>
            <li class="active-result" data-option-array-index="11">CLIENT GOLD</li>
            <li class="active-result" data-option-array-index="12">AS MAIS CURTIDAS DO FACEBOOK</li>
            <li class="active-result" data-option-array-index="13">%OFF Cursos em Vídeo</li>
            <li class="active-result" data-option-array-index="14">R$0,01 vale muito!</li>
            <li class="active-result" data-option-array-index="15">Formulário Grátis</li>
            <li class="active-result" data-option-array-index="16">Compre 1 Leve 2</li>
            <li class="active-result" data-option-array-index="17">Formulário Grátis</li>
        </ul>
    </div>
</div>

O que estou tentando fazer é acrescentar as linhas:

<li class="search-choice">
    <span>1 MÊS GRÁTIS</span>
    <a class="search-choice-close" data-option-array-index="0">
    </a>
</li>

Na seguinte posição

<div class="chosen-container chosen-container-multi" style="width: 300px;" title="" id="Promocoes_chosen">
    <ul class="chosen-choices">
      // EXATAMENTE AQUI //
        <li class="search-field">
            <input type="text" value="Selecione" class="" autocomplete="off" style="width: 25px;">
        </li>
    </ul>

Tentei fazer isso utilizando o método append mas, sem sucesso.

1
  • 1
    Coloca aí o teu append sff, pode ser um erro que tenhas. Commented 5/11/2014 às 17:09

2 Respostas 2

5

O append insere um item no final do elemento selecionado, e deveria funcionar pelo que vejo no seu exemplo.

Talvez seu script esteja adicionando mais itens nesse container, e você precise colocar no início? Se for isso, use prepend:

var el = $('<li class="search-field"><input type="text" value="Selecione" class="" autocomplete="off" style="width: 25px;"></li>');   
$('.chosen-choices').prepend(el);
3

Amigo você pode usar a função append do jQuery. Por exemplo:

$(".chosen-choices").append("<li class='search-choice'><span>1 MÊS GRÁTIS</span><a class='search-choice-close' data-option-array-index='0'></a></li>");

Segue uma demonstração aqui

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .