tooltip templ

templ

<script id="drone-templ" type="text/jst">
<div id="drones-source">According to: <%=source%></div>
<div id="drones-claim"><%=claim%></div>
<div id="drones-outlet">– <%=outlet%></div>
</script>

<script type="text/javascript">

$(document).ready(function() {

  var data=[
   {"statement_date":"5/29/2012","begin_date":"1/20/2009","end_date":"5/29/2012","deaths":"single digits","duration":1225,"timeline_start":"1/1/2004","days_from_start":1846,"claim":"The number of civilians killed in drone strikes in Pakistan under President Obama is in the 'single digits.'","source":"A senior administration official","outlet":"New York Times"},
   {"statement_date":"12/23/2011","begin_date":"1/1/2011","end_date":"12/23/2011","deaths":"a few","duration":356,"timeline_start":"1/1/2004","days_from_start":2557,"claim":"U.S. officials' 'acknowledged a few civilian deaths this year' in Pakistan","source":"U.S. officials","outlet":"Los Angeles Times"}
   ];

  var droneTmpl=$("#drone-templ").html()
  var tmpl=_.template(droneTmpl)

   var dronesBar=$(".drones-bar");	
   dronesBar.hover( 
     function(e) {
     dronesBar.removeClass("active");
     $(this).addClass("active");	         
     },
     function (e) {                 
     }
   );

   dronesBar.hover( 
     function(e) {
     dronesBar.find("span:last").remove();
                    
     var index=$(".drones-bar").index(this);
     $("#drones-blurb").html(tmpl(data[index]))
         
     },
     function (e) {                 
     }
   );

  });
 </script>