Why does it always return null?

You are mixing native elements with jQuery methods. The document.getElementById('id1') gives null because in document (i.e. the page) there is no element with id id1 . It exists only within the string linha .

If you want to use addClass you have to select the element with jQuery like this:

var linha = '<li id= "id1" class="c1"> ' +
    '<div id="id2">1</div>' +
    '<div id="id3">2</div></li>'
var $linha = $(linha);
$linha.addClass('c2');
$(document.body).append($linha); // ou dentro do <ul> que imagino que tenhas

jsFiddle: link

You can create a% temporary% to make such changes. If you use native methods you can use div like this:

var linha = '<li id= "id1" class="c1"> ' +
    '<div id="id2">1</div>' +
    '<div id="id3">2</div></li>'
var temp = document.createElement('div');
temp.innerHTML = linha;
temp.querySelector('#id1').classList.add('c2');
document.body.innerHTML = temp.innerHTML;

jsFiddle: link

The problem is that your linha variable is not added to document so you can make the selection through document.getElementById('id1') , so to solve this without using jQuery, you should add the variable linha to a DOM , in case it can be a virtual DOM:

var linha = '<li id= "id1" class="c1"> ' +
  '<div id="id2">1</div>' +
  '<div id="id3">2</div></li>';

// cria dom virtual
var domVirtual = document.createElement("span");
// adicionar string html ao domVirtual, tornado-a um elemento html de fato
domVirtual.innerHTML = linha;
// seleciona elemento no dom virtual por id
var id1 = domVirtual.querySelector("#id1");
// adiciona class ao elemento
id1.classList.add("c2");

console.log(id1.className)

// agora aqui sua variavel id1, já está com o elemento pronto para ser utilizado.

jsFiddle Example.

Another problem in your code is that there is no addClass method in the Element interface , where you can use the classList (which is readonly ), then using the method add() of classList , being represented by this part of the code presented previously:

// adiciona class ao elemento
id1.classList.add("c2");

Complementing @Sergio's response, you do not need to select by id because when you pass a string with html to jquery, how are you using it, it retains all elements root (in this case, just that you want).

If you have more li's in the string, you can use the filter method, or if you want lower-level elements, you can use find .

var $linha = $("<li id='id1'>li a ser selecionada</li>" +
               "<li id='id2'>li não selecionada</li>");
$linha.filter("#id1").addClass("c2");

var $linha = $("<div id='container'>" +
                   "<li id='id1'>li a ser selecionada</li>" +
                   "<li id='id2'>li não selecionada</li>" +
               "</div>");
$linha.find("#id1").addClass("c2");