How to get div value using jquery?

jquery get input value by name
jquery get all attributes
get textbox value in jquery on button click
jquery replace text in div
jquery get html element
jquery get element by id
jquery set textarea value
jquery find text

I am trying to get div value using jquery in chrome console from this:

<div class="col-md-3">
  <div class="vou-col" style="cursor: pointer">
    <h4>Free Large Bucket</h4>
    <span class="sku-info">Voucher123</span>
  </div>
</div>

I am getting the following error:

$('.sku-info').val()

VM783:1

Uncaught TypeError: $(...).val is not a function at :1:21

How to get value of a div using javascript, Description: Get the current value of the first element in the set of matched elements. version added: 1.0.val(). This method does not accept any arguments. Teams. Q&A for Work. Stack Overflow for Teams is a private, secure spot for you and your coworkers to find and share information.

You can use .text()/.html() instead of .val() for this.. check updated snippet below.

console.log($('.sku-info').html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-3">
<div class="vou-col" style="cursor: pointer">
    <h4>Free Large Bucket</h4>
    <span class="sku-info">Voucher123</span>
</div>
</div>

Get the combined text contents of each element in the set of matched elements, To set or get the text value of input or textarea elements, use the .val() method. 17 bronze badges. add a comment. |. 0. your div looks like this: <div class="readonly_label" id="field-function_purpose">Other</div>. With jquery you can easily get inner content: Use .html () : HTML contents of the first element in the set of matched elements or set the HTML contents of every matched element.

include jquery

var spanval = $('.sku-info').html();
alert(spanval);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-3">
   <div class="vou-col" style="cursor: pointer">
       <h4>Free Large Bucket</h4>
        <span class="sku-info">Voucher123</span>
     </div>
 </div>

Get Content - text(), html(), and val(). Three simple, but useful, Use a jQuery method to return the text content of a <div> element. $("div"). ();. Submit Answer ». You can use jQuery to find the text content of div and the HTML content of div. You have to use the jQuery text() and html() to find the HTML content and the text content of div. If you want to get div text content on click of the button, you need to access the button and the div. To access the element you have to use the jQuery selectors. How to Get Div Text Content Using jQuery

Problem

It seems that your jQuery is running in no conflict mode - so $ is the browser console's native function. This is often the case if using a version of jQuery which comes bundled with a CMS such as WordPress or Drupal.

Solution

You can use the full version:

jQuery(".sku-value").text();

We can infer this is the case because the error is ".val(...) is not a function" - if it were jQuery then .val would be a function.

Useful debugging tip

You can check to see if $ is jQuery by seeing if it has a version number

console.log($.fn.jquery)

If $ is jQuery then this will log a version number - something like "2.1.1". If $ jQuery is not jQuery, it'll log undefined.

How to return the value of the value attribute of the FIRST matched element. Set the value attribute using a function. Using a function to set the value of the value  / In : jQuery Faqs To get class name of div element using jQuery, you have to use attr() function and pass the argument ‘class’. It find the class name on button click for the selected element. See the examples given below to find out how to get the class name.

$(".sku-info").attr('value')

should do the trick since this control is not an input ;)

To get the innerHTML of a div tag in jQuery, use the class with innerHTML <div class="a">Value one</div> <button id="button1">Get</button>  The jQuery attr () method is used to get attribute values. The following example demonstrates how to get the value of the href attribute in a link: $ ("button").click(function() { alert ($ ("#w3s").attr("href")); Try it Yourself » The next chapter explains how to set (change) content and attribute values. jQuery Exercises.

A chapter on getting and setting text, HTML and values from HTML elements <​div id="divTest"> <b>Test</b> <input type="text" id="txtTest" name="txtTest"  The .val() method is primarily used to get the values of form elements such as input, select and textarea.When called on an empty collection, it returns undefined.. When the first element in the collection is a select-multiple (i.e., a select element with the multiple attribute set), .val() returns an array containing the value of each selected option.

Here are some more FAQ related to this topic: How to remove wrapper element but keep the text content intact using jQuery · How to get the value in an input text​  HTML Forms contains various elements like input fields, options, textarea etc. and for further processing, we need to get value of each field using jQuery. This tutorial, Explains about, how to get input values of different HTML form elements using jQuery as follows: we have taken three form elements in our example – input field, radio button

In jQuery, you can get the tag value or element content from a selected tag. For example,. 1. Select a tag name of 'p' and display its tag value. The checkbox is very useful to get multiple values. By default, the selected checkboxes value is posted on form submission to the server-side. But if you want to get the selected checkboxes values without form submission, jQuery is the best option. The selected checkboxes value can be get easily using jQuery.

Comments
  • $('.sku-info').text() since a span object don't contain a value but only text
  • I also used: $('.vend-sku-info span').text()/$('.vend-sku-info span').val() but I am getting same error.
  • @CarstenLøvboAndersen I used this but still getting error: VM1165:1 Uncaught TypeError: $(...).text is not a function at <anonymous>:1:21
  • Have you included jquery?
  • @CarstenLøvboAndersen Yes I have included jquery
  • Not enough information. Look at the error $(...).val is not a function. So, why isn't val a function? It should be a function even if you use it with div tag or span tag (although it should return null)
  • @clone The only reason I can see for this is OP not including jQuery - didn't notice this at first. I have updated my answer to include this information, thanks!