We Keep Coding

How can I get text from href?

I've got problem with getting this text from href. I'm working on dom and I'd like to get text from this href:
<div class='xx'>
<a href='zz' class='button>
...
I was trying to do sth like that:
document.getElementById(".xx").getAttribute("href")
But it's not working properly

But it's not working properly
Because
you don't have an element with id attribute .xx,
.xx targets the div not the anchor
Also, your anchor tag's attribute class is not closed properly, also closing tag is not given either.
<div class='xx'>
<a href='zz' class='button'>Some text</a>
</div>
you have a class so use the class selector itself using querySelector
document.querySelector( ".xx .button" ).getAttribute( "href" )
or simply
document.querySelector( ".xx .button" ).href;

getElementById will grab an element by that ID. You have an anchor (malformed albeit) with not an ID but a class. Secondly you are targeting the parent div. You should be targeting the tag using querySelector() instead. Then to get the href you'd use href.
const href = document.querySelector('.xx .button').href;
console.log(href);
<div class='xx'>
<a href='zz' class='button'></a>
</div>

This works for me
document.getElementsByClassName("xx")[0].getElementsByTagName("a")[0].getAttribute("href")

The code below will get text from link:
var x = document.getElementsByClassName('xx')[0].getElementsByTagName("a")[0].getAttribute("href");

you can use id instead of class because class returns undefined value.and also you tried to get class using getby id
wrong:
document.getElementById(".xx").getAttribute("href")
function h()
{
alert(document.getElementById("button").href);
}
<a href='zz' id='button' onclick='h();'>
asd</a>

var yourhref = document.querySelector("div.xx a.button").href
yourhref holds your requested value. This is as precise as it gets using only the part of code you provided. If somewhere else on the page you have a div with class xx and a link with class button you are not gonna have a good time.
Solution - either have your targeted element or parent have UNIQUE id and then write a selection from there.

Append new path in all the a href URL

I have seen the post How to update (append to) an href in jquery? , but it doesn't seem like the answer can help at my case.
I am currently using a plugin(easytab) to create a few different tab and every tab contains a tag like <a id="tabopen" href="www.text.com/custom/questions/ask/">
<a id="tabopen" href="www.text.com/default/questions/ask/">
and for some reason I have a button which append some extra path to all the href in order to redirect user to the right place.
I have tried to use
$("a#tab1").each(function() {
var _href = $(this).attr("href");
$(this).attr("href", _href + 'startDate=20160121?endDate=20160212');
});
but instead append the 'startDate=20160121?endDate=20160212' it replace everything to www.text.com/custom/questions/ask/startDate=20160121?endDate=20160212 , which is not right, how should i fix it?
Update 1:
I am sorry that i have provide wrong description at, the ids are actually the same in the plugin.
<a id="tabopen" href="www.text.com/custom/questions/ask/">
<a id="tabopen" href="www.text.com/default/questions/ask/">

$("a#tab1") selects a single <a> element having ID as tab1. To change the href attribute of a single element there is no need of each.
var href = $('a#tab1').attr('href') + '?startDate=20160121&endDate=20160212';
$('a#tab1').attr('href', href);
If having multiple elements with same ID, ID should be unique.
To select all the elements whose ID starts with tab, you can use attribute start with selector. I'll suggest to use a unique class on them.
To change the href attribute value of all the matched elements .attr(attributeName, function) with callback function can be used.
$('a[id^="tab"]').attr('href', function(i, oldHref) {
return oldHref + '?startDate=20160121&endDate=20160212';
});
As said by #charlietfl in the comment, the querystring format should be as follow
'?startDate=20160121&endDate=20160212'
^ ^
Update:
Saying again, ID should be unique., you can use class instead of ID for similar purpose elements.
Change the markup to use class
<a class="tabopen" href="www.text.com/custom/questions/ask/">
<a class="tabopen" href="www.text.com/default/questions/ask/">
And then use the selector
$('.tabopen').something...
BAD PRACTICE:
If you can't change the markup(auto-generated markup by some plugin), you can use attribute value selector to select all elements having same ID
$('a[id="tabopen"]').something...

How to get inner html based on attribute Id

I have the attibute Id.
In console when I type in the following jquery command:
$('#LocationRadioButtons a')
I get the following output
[<a id=​"4" href=​"#">Test​</a>​, <a id=​"5" href=​"#">Test1​</a>​, <a id=​"6" href=​"#">test2​</a>​]
Which is an array
If I type in the following jquery command:
$('#LocationRadioButtons a').first();
It will return the first element in that array:
Test​​
How do I return an element based on it's Id, and return its innerHTML. For example id = 5 innerHTML is test1,
Cheers

You can get the html by using html()
You can use
$('#LocationRadioButtons #5').html();
Based off your markup you can actually simply use
$('#5').html();
PS: I'd refrain from having ids start with a number. HTML4 doesn't like this.

while Id is unique for this element you can directly use id to get html
$('#5').html();

Try this,
$('#LocationRadioButtons a[id$="5"]').text();

an id is unique so you can just use the id selector to select an element with a specific id like this:
$('#5').html();

Try this:
As you already have the elements id, just do
$('#5').html();
Will alert Test1
jquery each() loop is useful when you don't have a selector and you want to parse through each element to check for certain condition.
$('#LocationRadioButtons a').each(function(index, value){
var myattr = $(this).attr('id');
if(myattr=='5') {
alert( $(this).html() );
}
});

How to read the contents of a href with javascript?

I have the following html and am stumped as to how to read the contents of the href tag?
<p class="xyz-title">
<a href="http://www.youtube.com/embed/xyz">
<span class="field-content">Title here</span>
</a>
</p>
I tried document.getElementByClass('xyz-title')[0].innerHTML but that didn't work obviously.
Thanks very much for pointing me in the right direction.

It is a syntax error. It is supposed to be getElementsByClassName. Use this instead:
document.getElementsByClassName('xyz-title')[0].innerHTML
And for selecting the <a> tag inside the <p class="xyz-title"> You need to use this code:
document.getElementsByClassName('xyz-title')[0].children[0].href
document.getElementsByClassName('xyz-title')[0].getElementsByTagName('a')[0].href
Or, you can simply use:
document.getElementsByTagName('a')[0].href
Fiddle: http://jsfiddle.net/praveenscience/DZhRv/

.innerHTML will give you the content of the element, not the value of any attributes. .href will give you the href value.
You tried to use getElementByClass() by there is no such function - you want getElementsByClassName() (as per the tag that you added to the question), a function that returns a list so you do need the [0] to get the first one.
To select the anchor element, try:
document.getElementsByClassName('xyz-title')[0].getElementsByTagName('a')[0].href
Or, simpler:
document.querySelector('.xyz-title a').href
Demo: http://jsfiddle.net/6Pg43/
Note that either way will give an error if the elements don't exist.

Working FIDDLE Demo
Try this:
var href = document.getElementsByClassName('xyz-title')[0].getElementsByTagName('a')[0].href;
alert(href);

How to get an element by its href in jquery?

I want to get an element by its href attribute in jquery or javascript. Is that possible?

Yes, you can use jQuery's attribute selector for that.
var linksToGoogle = $('a[href="https://google.com"]');
Alternatively, if your interest is rather links starting with a certain URL, use the attribute-starts-with selector:
var allLinksToGoogle = $('a[href^="https://google.com"]');

If you want to get any element that has part of a URL in their href attribute you could use:
$( 'a[href*="google.com"]' );
This will select all elements with a href that contains google.com, for example:
http://google.com
http://www.google.com
https://www.google.com/#q=How+to+get+element+by+href+in+jquery%3F
As stated by #BalusC in the comments below, it will also match elements that have google.com at any position in the href, like blahgoogle.com.

var myElement = $("a[href='http://www.stackoverflow.com']");
http://api.jquery.com/attribute-equals-selector/

Yes.
$('a[href=\'http://google.com\']')
http://api.jquery.com/attribute-equals-selector/