CODEWITHSUNDEEP
javascriptjquery
ptamzz
ptamzz

Reputation: 9375

how to pick up string inside a <li> tag using jquery

I've a simple list and a form text-field:

<ul>
  <li class="item">one</li>
  <li class="item">two</li>
  <li class="item">three</li>
  <li class="item">four</li>
</ul>
<input id="field" type="text" />

When the user clicks on an <li> item, I want the string inside the li element to be assigned the value of the input field.

Something like:

$('.item').click( function(){
  $('#field').val(/*put the string inside the li element just clicked*/);
});

So how do I get the string in the li element?

Upvotes: 1

Views: 1580

Answers (4)

David Thomas
David Thomas

Reputation: 253506

I'd personally suggest using a very similar suggestion to those already-posted, but with text() rather than html:

$('.item').click(
    function(){    
        $('#field').val($(this).text());
    });

It's a slim justification, but, as the docs note:

Unlike the .html() method, .text() can be used in both XML and HTML documents.

Otherwise they seem to be much the same.

Reference:

Upvotes: 3

Tim Joyce
Tim Joyce

Reputation: 4517

$('.item').click( function(){
  $('#field').val($(this).html());
});

Upvotes: 1

JohnP
JohnP

Reputation: 50029

.html() is what you're looking for. Please look it up in the API : http://api.jquery.com/html/

$('.item').click( function(){
  $('#field').val($(this).html());
});

Upvotes: 2

Prescott
Prescott

Reputation: 7412

$('.item').click(function(){    
    $('#field').val($(this).html()); 
});

Upvotes: 3

Related Questions