Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

How to create and call a custom JQuery function?

B

blakemckenna

PowerPoster
Joined
Jan 22, 2004
Messages
4,928
I have a scenario in which I want create I need to set the display of several elements with the same class. My thinking was to create a custom jQuery function that contains a For Loop that would do this. I'm still learning jQuery and I've never created a custom function like you would in Javascript. The below code is what I need to put into this function. Should I just do this in Javascript?

Code: 
var x = document.getElementsByClassName('reset');

for (var i=0; i<x.length; i++) {
    x[i].style.display = 'none'
}


Thanks,
 
jmcilhinney

jmcilhinney

.NUT
Joined
May 20, 2005
Messages
104,556
You wouldn't use a loop in jQuery. You would use a selector. With a jQuery selector you can match zero, one or more elements and then the subsequent action is performed on each one. I suggest that you do some reading on jQuery selectors. Better you learn how to fish than just get handed this one fish. If you don't understand the principle, you'll be back looking for more fish in no time.
 
jmcilhinney

jmcilhinney

.NUT
Joined
May 20, 2005
Messages
104,556
By the way, jQuery is JavaScript. Its basically just a JavaScript library. Anything you write in jQuery, you are writing in JavaScript. It's a matter of whether you're using the functionality provided by the library or just the standard JavaScript functionality.
 
B

blakemckenna

PowerPoster
Joined
Jan 22, 2004
Messages
4,928
I knew that it was Javascript...jQuery is just a wrapper from what I can tell. But I will definitely read up on it.

Thanks jmc
 
S

Sherin

New member
Joined
Jul 19, 2019
Messages
32
Code: 
<html>
<head>
<script>

function get(){
var x = document.getElementsByClassName('reset');

 for (var i=0; i<x.length; i++) {
    x[i].style.color = 'red'
  }
}
</script>
</head>

<body>
<button onclick="get()">Click</button>

<p class="reset">1</p>
<p class="reset">2</p>
<p>3</p>
<p>4</p>

</body>
</html>
 
You must log in or register to reply here.

Online statistics

Members online
1
Guests online
2
Total visitors
3
Totals may include hidden visitors.

Newest members

Stay Connected

Top