Dynamic Javascript function in Django "for" loop

Question

In the following Javascript, I would like to replace all text beginning with "#" to become a link and change the color. The function works fine, but it changes all of the descriptions on the page instead of each photo individually. Is there a way to have it work for each photo in the for loop?

Javascript:

var str = $('.description').html();
var edt = str.replace(/(^|\s)(#[a-z\d-]+)/ig, "$1<a href='{% url "timeline" %}'><span style='color: blue;'>$2</span></a>");
$('.description').html(edt);

Django:

{% for photo in photos %}
    <div class="photo-item">
        <p class="description">{{ photo.description }}</p>
    </div>
{% endfor %}

Thank you in advance!

Dric512 · Accepted Answer · 2015-08-24 12:48:42Z

1

In your Javascript, $('.description') returns a list of all the elements that have a class description, while the html() function

returns the content of the FIRST element when reading
modifies EACH element when updating

What you need is something like this (Not tested):

$('.description').each(function(index) {
  var str = $(this).html();
  var edt = ...;
  $(this).html(edt);
});

answered Aug 24, 2015 at 12:48

Dric512

3,7811 gold badge24 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Dynamic Javascript function in Django "for" loop

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related