[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now

x
?
Solved

Quick javascript help

Posted on 2014-12-12
6
Medium Priority
?
88 Views
Last Modified: 2014-12-12
Hello,

I need to add <span>*</span> for each character in the 'info' variable.

It is close but I can not figure out how to get the second function to edit the info variable and save it so I can write it later.

==
info = "<div class=\daysz\">Days<div class=\"infoz\">" + daysLeft + "</div></div><div class=\daysz\">Hours<div class=\"infoz\">" + hrsLeft +"</div></div><div class=\daysz\">Minutes<div class=\"infoz\">" + minsLeft + "</div></div>";

var words = $(".infoz").text().split("");
$(".infoz").empty();
$.each(words, function(i, v) {
    $(".infoz").append($("<span>").text(v));
});
==
0
Comment
Question by:movieprodw
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 60

Expert Comment

by:HainKurt
ID: 40496813
for each character???

<div class="daysz"...

>>> like this? does not make sense...

<<span>*</span>d<span>*</span>i<span>*</span>v<span>*</span> <span>*</span>c<span>*</span>l<span>*</span>a<span>*</span>s<span>*</span>s<span>*</span>=<span>*</span>"<span>*</span>d<span>*</span>a<span>*</span>y<span>*</span>s<span>*</span>z<span>*</span>"<span>*</span>...
0
 
LVL 1

Author Comment

by:movieprodw
ID: 40496838
Each character in the .infoz not the whole thing.

I have it like this Days 90 but I want to make a box around each one for countdown styling so I need it to be:

<div class="daysz">Days<div class="infoz"><span>9</span><span>0</span></div></div>
0
 
LVL 1

Author Comment

by:movieprodw
ID: 40496841
If you want to help me just work with the variable that is great too.

split: daysLeft
append: <span>
save as: daysLeft
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 60

Accepted Solution

by:
HainKurt earned 2000 total points
ID: 40496865
try this:

var daysLeft = 10;
var hrsLeft = 14;
var minsLeft = 34;

info = "<div class=\"daysz\">Days<div class=\"infoz\">" + AddSpans(daysLeft) + "</div></div><div class=\"daysz\">Hours<div class=\"infoz\">" + AddSpans(hrsLeft) +"</div></div><div class=\"daysz\">Minutes<div class=\"infoz\">" + AddSpans(minsLeft) + "</div></div>";

function AddSpans(s){
    return "<span>" + s.toString().split("").join("</span><span>") + "</span>";
}

alert(info);

Open in new window

0
 
LVL 1

Author Closing Comment

by:movieprodw
ID: 40496891
THANK YOU!

Seriously sat here for over an hour, thank you.
0
 
LVL 60

Expert Comment

by:HainKurt
ID: 40496909
just note that I also fixed your info variable... you missed out lots of ", like below:

info = "<div class=\"daysz\">Da...
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

649 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question