var a = $('#txta').val();
console.log(a);  

result is plete html code from this url

Now I want to get content of all #artikal-naziv tags (there are 96)

var b = a.find("#artikal-naziv").text();
console.log(b);

Result:

Uncaught TypeError: a.find is not a function

Any help?

var a = $('#txta').val();
console.log(a);  

result is plete html code from this url

Now I want to get content of all #artikal-naziv tags (there are 96)

var b = a.find("#artikal-naziv").text();
console.log(b);

Result:

Uncaught TypeError: a.find is not a function

Any help?

• javascript
• jquery
• html
• sugarcrm
• suitecrm

• 4 $(a).find("#artikal-naziv").text(); should do the trick. But dont ever use an ID multiple times in a html. – Jasper Seinhorst Commented Nov 8, 2017 at 13:01
• also post the html source code.. – Rohit Kumar Commented Nov 8, 2017 at 13:22

5 Answers 5

Actually you are calling .find() on a string and not in a DOM element.

Because from $('#txta').val() you are getting a string, that's why you got Uncaught TypeError: a.find is not a function, because string doesn't have .find() method.

You should change it to:

var a = $('#txta');

Then you can write:

var b = a.find("#artikal-naziv").text();

Note:

Now I want to get content of all #artikal-naziv tags (there are 96)

You can't set the same id #artikal-naziv for multiple elements (96), the id should be unique in the page.

Another thing .val() call assumes that your element is a form element, you can't call .val() on a div or a span, if it isn't a form element use .html() instead.

Because "a" is not a jQuery object - it's usually a string containing value of the returned element (txta).

Use $(a).find(...) instead - that will probably do it.

Ref link: https://stackoverflow./a/3532381/3704489

As per what I can make out of your description, you are getting HTML as string using var a = $('#txta').val();. If this is true, you will have to create an in-memory element and set this string as its HTML.

Then you will have an in-memory DOM section that you can query on.

You can try something like this:

var html = '<span><p id="artikal-naziv">bla bla</p></span>';

var $tempElement = $('<div>').html(html);
console.log($tempElement.find('#artikal-naziv').text());
// or using vanilla JS

var tempElement = document.createElement('div');
tempElement.innerHTML = html;

console.log(tempElement.querySelector('#artikal-naziv').textContent);

<script src="https://ajax.googleapis./ajax/libs/jquery/2.0.0/jquery.min.js"></script>

.val() takes out the value from the element....Whereas all DOM operations are done on the element... because function like .find() , .hide() , .show() , .closest() etc are used with the element not the value

The Following modifications should work...

var a = $('#txta'); // $("#ID") returns the element
console.log(a.val()); // $("#ID").val() returns the value

the result is plete html code from this URL

Now I want to get content of all #artikal-naziv tags (there are 96)

var b = a.find("#artikal-naziv").text(); // .find() easily works on element
console.log(b);

Simply use .find to find children and .closest to find parents:

<div class='a'>
    <div class='b'>
        <div class='c'></div>
        <div class='c'></div>
        <div class='c'></div>
    </div>
</div>

js:

var a = $('.b');
a.find('.c'); // Will return all the objects with the class c
a.closest('.a'); // Will return the first parent with the class a