I have this JavaScript functions that I want to convert to jquery but I can't understand jquery. It uses the document.getElementsByName a lot so I would like to know how to convert the document.getElementsByName into jquery.

function getElements(name){
    if (document.getElementsByName(name)[0].className == "visible"){
        document.getElementsByName(name)[0].className = "hidden";
    } else {
        if(document.getElementsByClassName('visible')[0] != null){
            document.getElementsByClassName('visible')[0].className = "hidden";
        }
        document.getElementsByName(name)[0].className = "visible";
    }
}

I have this JavaScript functions that I want to convert to jquery but I can't understand jquery. It uses the document.getElementsByName a lot so I would like to know how to convert the document.getElementsByName into jquery.

function getElements(name){
    if (document.getElementsByName(name)[0].className == "visible"){
        document.getElementsByName(name)[0].className = "hidden";
    } else {
        if(document.getElementsByClassName('visible')[0] != null){
            document.getElementsByClassName('visible')[0].className = "hidden";
        }
        document.getElementsByName(name)[0].className = "visible";
    }
}

• javascript
• jquery

• 16 please try to do it by yourself first – Ivan Chernykh Commented Sep 12, 2013 at 5:51
• What actually you trying to doing using JavaScript? – Ahmed Magdy Commented Sep 12, 2013 at 5:52
• There are a lot of things that you can be told on this, but I think you need to start learning jQuery rather than asking questions. This should be a better place for starting jQuery (api.jquery./category/core) – Naveed Butt Commented Sep 12, 2013 at 5:57
• @NaveedButt the specific question is how to convert getElementByName. While a tutorial is a good idea, this question does not appear too broad to me. – John Dvorak Commented Sep 12, 2013 at 5:58
• 2 -> api.jquery./category/selectors – Felix Kling Commented Sep 12, 2013 at 6:00

4 Answers 4

you can try with attribute selector...

 $('[name="'+name+'"]')  //for name selector
 $('.visible') //for class selector

You should try because when you try practicing you actually are learning:

• document.getElementsByName in jQuery $("[name=Name]");
• document.getElementsById in jQuery $("#IdofElement");
• document.getElementsByClass in jQuery $(".ClassofElement");

Here are some tutorials:

1. jQuery for Beginners
2. jQuery API
3. Beginners Guide to jQuery

You can refer to the below syntax for your reference.

$('[name=tcol1]') // matches exactly 'tcol1'

$('[name^=tcol]') // matches those that begin with 'tcol'

Try this.

function getElements(name1){
    if ($("[name='" + name1 + "'").hasClass("visible")){
        $("[name='" + name1 + "'").removeClass("visible").addClass("hidden");
    } else {
        if($(".visible") != null){
            $(".visible").addClass("hidden");
        }
        $("[name='" + name1 + "'").removeClass("visible").addClass("visible");
    }
}