Actual after reading it again I like MorningZ's solution better.
On Apr 16, 9:45 am, David <david.sulli...@gmail.com> wrote: > The problem I see is what happens when there is more than one class? > Your icon call may not be the first class. in which case you would not > have selected it. But it was still supposed to get an icon. Would it > be possible to give the divs that are supposed to receive the icons a > generic class then use an attribute to define what icons it is > supposed to have. You could even reduce the amount of code that you > have to output. > > <div class="icon button" img="Star"></div> > > $(".button").each(function(){ > if ($(this).hasAttribute("img") && $(this).attr("img") != "") > { > $(this).append("<IMG SRC='" + $(this).attr("img") + ".gif'>");} > > ) > > I know that it is probably not the best code as you are using > attibutes that do not fall into the dom standards but it looks like it > would get the job done. > > On Apr 16, 8:51 am, jonhobbs <jon.hobbs.sm...@gmail.com> wrote: > > > > > Here is some psuedo-code for what I'm trying to achieve... > > > $(".button").each(function(){ > > > // Get an array of classes that are attached to $(this) > > > // Loop through the array classes > > for (items in array){ > > > // check to see if the class starts with "icon" > > if(className.startswith('icon')){ > > > // remove the first 4 characters > > var iconName = className.substring(4, className.length); > > > // Use the remainder to append the image > > $(this).append("<IMG SRC='" + iconName + ".gif'>"); > > > } > > > } > > > }); > > > That way, I could have hundreds of possible icons and I wouldn't have > > to have hundreds of IF statements and hundreds of calls to .hasClass() > > > On Apr 16, 2:16 pm, MorningZ <morni...@gmail.com> wrote: > > > > Well, other than asking whether or not an object "has a class or > > > doesn't", there isn't much you can do that check each class name > > > > so like (and this assumes your original HTML, not the separated class > > > name) : > > > > var icons = ["Star", "Plus", "Left", "Right", "Up", "Down"]; > > > $("div.button").each(function() { > > > var $dv = $(this); > > > $.each(icons, function() { > > > if ($dv.hasClass("icon" + this)) { > > > $dv.append('<img src="Images/' + this + '.gif" > > > alt="" />'); > > > return false; > > > } > > > }); > > > > }); > > > > On Apr 16, 9:08 am, jonhobbs <jon.hobbs.sm...@gmail.com> wrote: > > > > > Thanks MorningZ, but does that dolve the problem? > > > > > I'd still have to do a .hasClass() for each possible icon, wouldn't I? > > > > > On Apr 16, 2:03 pm, MorningZ <morni...@gmail.com> wrote: > > > > > > It would be MUCH easier and cleaner to separate "icon" and "Star/ > > > > > PlusLeft/Right/Up/Down", a la: > > > > > > <div class="button icon Star"></div> > > > > > <div class="button icon Plus"></div> > > > > > <div class="button icon Left"></div> > > > > > <div class="button icon Right"></div> > > > > > <div class="button icon Up"></div> > > > > > <div class="button icon Down"></div> > > > > > > If that's possible, that seriously would make your code easier and > > > > > less complicated > > > > > > On Apr 16, 8:58 am, jonhobbs <jon.hobbs.sm...@gmail.com> wrote: > > > > > > > This might be hard to explain, but I need a way to loop through a > > > > > > bunch of elements I've already selected and for each one find > > > > > > classes > > > > > > that start with the word "icon". So for example I might have the > > > > > > following elements > > > > > > > <div class="button iconStar"></div> > > > > > > <div class="button iconPlus"></div> > > > > > > <div class="button iconLeft"></div> > > > > > > <div class="button iconRight"></div> > > > > > > <div class="button iconUp"></div> > > > > > > <div class="button iconDown"></div> > > > > > > > So, I begin by selecting the elements and looping through them.... > > > > > > > $(".button").each(function(){ > > > > > > // Some code here > > > > > > > }); > > > > > > > Now, I could put the following code in the loop... > > > > > > > if ($(this).hasClass("iconStar")){ > > > > > > $(this).append("<IMG SRC='Images/star.gif'>"); > > > > > > > } > > > > > > > I would then have to repeat that for each possible icon, which seems > > > > > > very inefficient. > > > > > > > What I'd like to do in the "each" loop is just cycle through all the > > > > > > classes that $(this) has and pick out the one that begins with ICON > > > > > > and then use that to append the image. > > > > > > > Can anyone help?- Hide quoted text - > > > - Show quoted text -- Hide quoted text - > > - Show quoted text -