creating jquery functions and using them for html elements?

Question

im trying to create this function in javascript but its not working, im a bit new to js, so i don't what im really doing wrong here.

the code:

<div id="test">TESTING</div>

JS:

function animateDiv(div){

var text = $('#' + div + '"').text();

var doAnimate = function() {
    $('span').each(function() {
        var that = $(this);
        setTimeout(function() {
            that.animate({ fontSize: "90px" }, 1500 )
                .animate({ fontSize: "50px" }, 1500 );
        },that.index()*100);
    });
}

$('#' + div + "'").html('');

for(i=0; i<text.length; i++) {
  $('#' + div + "'").append('<span>'+text[i]+'</span>');
    if(i==text.length-1) doAnimate();
  }

}
  // using the function here to run animation on div test from html  
 animateDiv(test);

the jsfiddle is here: http://jsfiddle.net/aA8Un/3/

its more this function is not working i dont know why sort of question. i clarified this at the top. — unknown
– unknown, Commented Jul 24, 2012 at 13:05
the version I saw was working, but it was different code to what you had posted here. — Alnitak
– Alnitak, Commented Jul 24, 2012 at 13:17
its noot a problem, thanks for helping, the question has been answered now!! — unknown
– unknown, Commented Jul 24, 2012 at 13:18
please be more careful next time. The code posted here had obvious flaws, but your question was lousy. — Alnitak
– Alnitak, Commented Jul 24, 2012 at 13:19

yogi · Accepted Answer · 2012-07-24 13:07:54Z

1

This works now

function animateDiv(div){

var text = $('#' + div.id).text();

var doAnimate = function() {
    $('span').each(function() {
        var that = $(this);
        setTimeout(function() {
            that.animate({ fontSize: "90px" }, 1500 )
                .animate({ fontSize: "50px" }, 1500 );
        },that.index()*100);
    });
}

$('#' + div.id).html('');

for(i=0; i<text.length; i++) {
  $('#' + div.id).append('<span>'+text[i]+'</span>');
    if(i==text.length-1) doAnimate();
  }

}

 animateDiv(test);

Actually you were trying to concatenate a string and an object by this $("#"+div), which is wrong, you should do this $("#"+div.id) which is legal.

answered Jul 24, 2012 at 13:07

yogi

19.6k13 gold badges67 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

bugwheels94 · Accepted Answer · 2012-07-24 13:01:57Z

1

You have to call the function using single/double quotes like

animateDiv("test");

instead of

animateDiv(test);

And remove '"' from your code everywhere

So Make it $('#' + div + '"') to $('#' + div)

Working Demo

answered Jul 24, 2012 at 13:01

bugwheels94

32.2k3 gold badges43 silver badges62 bronze badges

Comments

BonyT · Accepted Answer · 2012-07-24 13:02:26Z

0

var text = $('#' + div + '"').text();

replace with

var text = $('#' + div).text();

answered Jul 24, 2012 at 13:02

BonyT

11k5 gold badges34 silver badges53 bronze badges

Comments

Thomas · Accepted Answer · 2012-07-24 13:11:14Z

0

animateDiv('test')
subsitute $('#' + div + '"') with $('#' + div)

edited Jul 24, 2012 at 13:11

Thomas

8,8592 gold badges28 silver badges54 bronze badges

answered Jul 24, 2012 at 13:05

Alex Ball

4,4842 gold badges20 silver badges23 bronze badges

Collectives™ on Stack Overflow

creating jquery functions and using them for html elements?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related