We Keep Coding

How to store the element inside anchor tag in a variable?

I am using table and the element inside the table are added dynamically with the JSON data. The table data consists of Id and other things. I had put id inside the anchor tag so that it gets navigated to another page which shows all the data of that Id. I want to show the data of only selected Id. So I want to set the element inside the anchor tag to a variable ... is there any way to achieve this ?
<a href="other_page.html">link Label<a>
Now I want to store this "link Label" into a variable in JavaScript or AngularJS is there any way?

You can use data attribute for this. for example
<a href="other_page.html" data-id="3" id="click">link Label<a>
and in you javascript :
<scrtipt>
document.getElementById("click").addEventListener("click", function(event){
alert(this.getAttribute("data-id"));
});
</script>
Hope it can be helpful.

<a id="jsonObject.id" href="other_page.html" onClick="clickFunction">link label</a>
You can set anchor id with that particular id. Then on click function you can send event object and get that particular ID.
JS code
function clickFunction(event){
console.log(event.currentTarget.id);
}

Sure you can do!
You can get the text inside tags by calling .innerHTML of the element. In your case this would mean something like this:
<a href="other_page.html" id="tagid">link Label<a>
You need an id for the tag and then in JavaScript
var value = document.getElementById("tagid").innerHTML;

I am unable to a inserting the content HTML pre tag

Function objective()
{
Document.getelementbyid("pre").innerhtml=""
}
And in the HTML for my li in nave, I declared the onclick function but it is not working.
Note:- I am clear about case sensitivity in js and using bootstrap3
for resposive.

Use document.getElementsByTagName instead. This will return an array of all the elements that have that tag name.
Due to it returning an array, you need to make sure you use [0] to find the first index in the array.
function objective(){
document.getElementsByTagName("pre")[0].innerHTML="";
}
objective();
<pre>This is some content that will not show in the snippet</pre>
<div>This content will though</div>

getelementbyid() expect a id, not a tag name,your code will call on html like
<pre id="pre">
</pre>
if you want to select elementnot by id but form tag name use document.querySelectorAll("pre")[0] or document.querySelector("pre")
remember querySelectorAll return an array!!

getElementById selects an element with defined id as in your case pre as an id.
You must have an id attached to your element same that of argument in getElementById().
Or, you can use getElementsByTagName which selects element given in argument.

jquery use data tag selector after updating data tag on element

I want to be able to get a set of elements that match a selector in jQuery. I have HTML with data tag attributes that get altered dynamically by jQuery using the .data(key, value) method.
However, after dynamically updating an element's data tag it seems I can no longer use a selector to get that element with the updated value. It still returns the old value.
I have a JSFiddle setup to demonstrate this issue:
https://jsfiddle.net/o6pnvqgv/1/
Here is the example code:
<span id="example" data-tag="5"></span>
<div id="result"></div>
<div id="result2"></div>
$(document).ready(function(){
var $example = $('#example');
$('#result').html($example.data('tag'));
$example.data('tag', 7);
$('#result').html("elements that have tag 5: " + $('[data-tag="5"]').length);
$('#result2').html("elements that have tag 7: " + $('[data-tag="7"]').length);
});
RESULT:
elements that have tag 5: 1
elements that have tag 7: 0
I know I can use a each loop and compare data for each individual element through an if statement.. But I want to be able to query all elements by the new set data tag value and get those results back.
Any help?

Your question is answered here:
jQuery .data() Not Updating DOM
$('#foo li[data-my-key="54321"]') is a attribute selector.
Using .data(..) changes the elements properties which you cannot select from without using a filter.
If you want to get all the elements with a certain property you can do this (using filter(...)):
$('#foo li').filter(function(index) {
return $(this).data('my-key') === 54321;
}); //returns all `#foo li` with data[my-key] === 54321
See here for more info: .prop() vs .attr()

jQuery selector to select a text immediate to img tag?

I'm having the following html code and trying to select text which is located immediate to img tag while clicking the respective img tag.
For example in the first <p> tag I should get "Politics",
<p>Environmental<img src="/img/bookmark.png" class="bookmark" id="bm1" data-username="usernames" data-userid="un123"> Politics</p>
<p>Science<img src="/img/bookmark.png" class="bookmark" id="bm2" data-username="usernames" data-userid="un123"> Explore</p>
<p>Contextual<img src="/img/bookmark.png" class="bookmark" id="bm3" data-username="usernames" data-userid="un123"> Learning</p>
I've used the following jQuery function, but nothing helped.
$("img.bookmark").click(function(){
console.log($(this).next());
});

The next jQuery function gets the next element. You want a text node. You need to use normal DOM traversal methods to get this: you need the nextSibling property.
$("img.bookmark").click(function(){
console.log(this.nextSibling);
});
You probably actually want its string value, for which you can use nodeValue:
$("img.bookmark").click(function(){
console.log(this.nextSibling.nodeValue);
});

You stated this For example in the first <p> tag I should get "Politics",
You can get it with .nextSibling.nodeValue:
$("img.bookmark").click(function(){
console.log(this.nextSibling.nodeValue);
});
Demo Fiddle

*nextSibling.data* will give you the text (in your case Politics/../..)
$("img.bookmark").click(function(){
alert(this.nextSibling.data);
});

How do I change the value of an input element?

is it possible to "override/overwrite" an input element fixed value using javascript and/or jquery?
i.e. if i have an input element like this:
<div id="myDiv">
<input type="text" name="inputs" value="someValue" />
</div>
is it possible to make a jquery object of that element and then change its value to something else then rewrite the jquery object to the dom??
I'm trying but obviously I haven't got good results!
I've been trying something like this:
$('input').val("someOtherDynamicValue");
var x = $('input');
$("#myDiv").html(x);

If you just want to manipulate the value of the input element, use the first line of your code. However it will change the value of every input element on the page, so be more specific using the name or the id of the element.
$('input[name=inputs]').val("someOtherDynamicValue");
Or if the element had an id
$('#someId').val('some Value');
Check out jQuery's selectors (http://api.jquery.com/category/selectors/) to see how to get whatever element you need to manipulate with jQuery.

You can directly access the value via the $.val() method:
$("[name='inputs']").val("Foo"); // sets value to foo
Without needing to re-insert it into the DOM. Note the specificity of my selector [name='inputs'] which is necessary to modify only one input element on the page. If you use your selector input, it will modify all input elements on the page.
Online Demo: http://jsbin.com/imuzo3/edit

//Changes on the load of form
$(document).ready(function(){
$('#yourTxtBoxID').val('newvalue');
});
//Changes on clicking a button
$(document).ready(function(){
$('#somebuttonID').click(function(){
$('#yourTxtBoxID').val('newvalue');
});
});