Javascript: read number of any value.

Question

I'm trying to apply a tooltip to a foreach loop, but I need the javascript to read the attribute "mystickytooltip" with a number at the end.

<div id="mystickytooltip{$smarty.foreach.cart.iteration}" class="stickytooltip">

Will output

<div id="mystickytooltip1" class="stickytooltip">
<div id="mystickytooltip2" class="stickytooltip">
<div id="mystickytooltip3" class="stickytooltip">

And I need the javascript to read "mystickytooltip(ANYVALUE)" is this possible? My JS knowledge sucks.

//stickytooltip.init("targetElementSelector", "tooltipcontainer")
stickytooltip.init("*[data-tooltip]", "mystickytooltip")

Thanks.

Answer 1

You can try this :

var i=1; // starting index
while(document.getElementById('mystickytooltip'+i)) {
  stickytooltip.init("*[data-tooltip]", "mystickytooltip"+(i++));
}

In english : as long as you can find an element with id 'mysticktooltip'+i (+ is string concatenation in js), call stickytooltip.init with this id as second parameter (and increment i).

Answer 2

In your previous (now deleted) question, it looked like you were using jQuery. If that's the case, you should just be able to use a class selector:

var myToolTips = $("div.mystickytooltip");

Or you could use the Attribute Starts With selector:

var myToolTips = $("div[id^='mystickytooltip']");

The only possible drawback I could forsee with the attr-starts-with selector is if you have any other div elements whose id begins with "mystickytooltip" (ie, "mystickytooltipcontainer"). In that case you could combine the class and attr-starts-with selectors:

var myToolTips = $("div.mystickytooltip[id^='mystickytooltip']");