Question

This is my html structure,

<div class="productbox">

<div class"result1 prod" name="BGFDTTTTJ">
<h2>Product 1 Title</h2>
<div class="nameattrib"></div>
</div>

<div class"result2 prod" name="BGFDTTTTJ">
<h2>Product 2 Title</h2>
<div class="nameattrib"></div>
</div>    
...
</div>

and this is my javascript

$(document).ready(function() {
    $(".productbox .prod").each(function(index, value){
      $(".nameattrib").append(" " + $(this).attr('name'));
    });
});

As a result i'm getting a html structure as,

<div class="productbox">

<div class"result1 prod" name="BGFDTTTTJ">
<h2>Product 1 Title</h2>
<div class="nameattrib">BGFDTTTTJ BHGFGFGG </div>
</div>

<div class"result2 prod" name="BHGFGFGG">
<h2>Product 2 Title</h2>
<div class="nameattrib">BGFDTTTTJ BHGFGFGG</div>
</div>    
...
</div>

What modification i need to avoid printing all name values, i.e,. i need to get result similar to below one.

<div class="productbox">

<div class"result1 prod" name="BGFDTTTTJ">
<h2>Product 1 Title</h2>
<div class="nameattrib">BGFDTTTTJ</div>
</div>

<div class"result2 prod" name="BHGFGFGG">
<h2>Product 2 Title</h2>
<div class="nameattrib">BHGFGFGG</div>
</div>    
...
</div>
Was it helpful?

Solution

Change javascript to this:

$(document).ready(function() {
    $(".productbox .prod").each(function(index, value){
      $(this).find(".nameattrib").text($(this).attr('name'));
    });
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top