CODEWITHSUNDEEP
javascriptjquery
Random User
Random User

Reputation: 59

jQuery dynamically set <h3> in <div>

for (var i = 0; i < weekNo; i++) {
  $("<div>").attr({
    'id': "chart_div_" + i
  }).css({
    'border': '1px solid #ccc',
    'width': '750px',
    'height': '200px'
  }).appendTo("body");
  $("<br>").appendTo("body");
}

How do I set, for each generated div, a h3 tag with a text ?

Upvotes: 0

Views: 652

Answers (2)

Pugazh
Pugazh

Reputation: 9561

This might help!

var weekNo = 5;

for (var i = 0; i < weekNo; i++) {

  var div = $("<div>").attr({
    'id': "chart_div_" + i
  }).text("Div " + i + " content here").css({
    'border': '1px solid #ccc',
    'width': '750px',
    'height': '200px'
  }).appendTo("body");

  $("<h3>").attr({
    'id': "h3_" + i
  }).text("Header " + i).prependTo(div);

  $("<br>").appendTo("body");
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Upvotes: 1

jcubic
jcubic

Reputation: 66590

try this:

for (var i = 0; i < weekNo; i++) {
    var div = $("<div>").attr({ 'id': "chart_div_" + i }).css({ 'border': '1px solid #ccc', 'width': '750px', 'height': '200px' }).appendTo("body");
    div.append('<h3>' + text + '</h3>');
    $("<br>").appendTo("body");
}

Upvotes: 2

Related Questions