title: Pass Django list of strings to JS as an array
body: <p><strong>Goal</strong>: I want to pass list of strings in Django to template JS as an array of strings and get index for each string in the array.</p>
  
  <p><strong>Problem</strong>: Javascript <code>indexOf()</code> is counting each character (e.g. letters, single quotes and brackets). My tries below are based on <a href="https://stackoverflow.com/questions/11306669/django-template-escaping">this</a>, <a href="https://stackoverflow.com/questions/21150133/pass-a-list-of-string-from-django-to-javascript">this</a> and <a href="https://stackoverflow.com/questions/18337407/saving-utf-8-texts-in-json-dumps-as-utf8-not-as-u-escape-sequence">this</a>.</p>
  
  <p><strong>Code 1</strong>: I tried <code>escapejs</code> and <code>safe</code> filters, but <code>indexOf()</code> is returning 2 for the first item in the array (should be 0).</p>
  
  <pre><code>#views.py
  list = [#utf-8 encoded strings]
  return render(request, template, {'list': list}) 
  
  #template JS
   $('#id').ready(function() {
   var array = "{{list|escapejs}}";
   console.log(array.indexOf('{{obj}}'));
   #obj is item in list});
  </code></pre>
  
  <p><strong>Code 2</strong>: Also tried <code>json.dumps()</code> with <code>encode('utf8')</code> or <code>json.loads()</code> but the problem persists.</p>
  
  <pre><code>#views.py
  list = [#utf-8 encoded strings]
  list = json.dumps(list, ensure_ascii=False).encode('utf8')
  return render(request, template, {'list': list}) 
  
  #template JS
   $('#id').ready(function() {
   var array = "{{list}}";
   console.log(array.indexOf('{{obj}}'));
   #obj is item in list});
  </code></pre>