Question 239290 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

How to html text show as par this attribute in jQuery?

The problem is not shown in each tag. I face some issues like this: attr is not a function.

$('document').ready(function() {
  jQuery('.custom-size .size .text').each(function() {
    var option_label = this.attr("option-label");
    jQuery(this).text(option_label);
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="custom-size">
  <div class="size">
    <div class="text" option-label="NONE"></div>
    <div class="text" option-label="44">NONE</div>
    <div class="text" option-label="46">44</div>
    <div class="text" option-label="48">46</div>
  </div>
</div>
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0 
    Try this =>
$('document').ready(function() {
            jQuery('.custom-size .size .text').each(function() {
                var option_label = jQuery(this).attr("option-label");
                jQuery(this).text(option_label);
            });
        });

  2. 0

    a) Since you are using the latest version of jQuery use $ instead of jQuery

    b) You need to use $(this) instead of this.

    C) Better to use data-attributes.

    Check below:

    $('document').ready(function() {
  $('.custom-size .size .text').each(function() {
    var option_label = $(this).data("option-label");
    $(this).text(option_label);
  });
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<div class="custom-size">
  <div class="size">
    <div class="text" data-option-label="NONE"></div>
    <div class="text" data-option-label="44">NONE</div>
    <div class="text" data-option-label="46">44</div>
    <div class="text" data-option-label="48">46</div>
  </div>
</div>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search